総合 ゲーム 画像動画

ゼロからはじめるプログラミング

2017/10/15- 絶賛編集中です。

  1. 前置き
  2. まずはHTMLから身につけよう!
  3. CSSを身につけよう!
  4. エディターを使って開発環境を整えよう。
  5. JavaScript(jQuery)を身につけよう!

 

『プログラミングに興味がある。

でも何からはじめたら良いか分からないしやったこともない・・・』

 

そんな方々にプログラミングに触れてもらおうと思い作った学習用ページです。

学習者の最終目標はデスクトップアプリを作れるようになることです。

(個人利用、趣味目的でプログラミングをする方へ向けての内容になります。業務・実務を目的とした人への考慮はしておりません。

 

ゲームをする方は攻略サイトやSNSの情報を集めるときに、役に立つツールを見たことはありますよね?

 

ダメージ計算機装備のスキル検索ツールなど

 

あんなのを作れるのって凄いですよね!

プログラミングを学習することで誰でも作れるようになります。

他にも日々のネットサーフィンの効率が飛躍的にに上がったりします。

できるようになることは語り尽くせないほどあります。アイディア次第で色々作れます。

私が公開してるウェブツールやデスクトップアプリなどはできることのほんの一部です。

 

 

学習するにあたってぶち当たりそうな問題

  • 何を言ってるか分からない
  • めんどくさい
  • 時間がない
  • 分からない

 

その気持わかります。プログラミングに限りませんが新たに何かを学ぶというのはどれも時間がかかるものです。そして途中で投げ出してしまうかもしれません。

 

でも大丈夫です!

それまでに得た知識は確実に蓄えられていきます。特にプログラミングの場合細かい単語(命令)を忘れても基本的な流れ、使い方を忘れることはほとんどありません。

知識はどんどん蓄積されていくので自分のペースでやっていきましょう!

半年、一年間空いたとしても大丈夫です。

 

プログラミングを趣味や遊びとしてとらえましょう。

仮想空間上ではありますが自分で物を作るというのは楽しいです!出来たときに満足感も得られますし自信にもなります。

さて、前置きはこのぐらいにして実際にはじめてみましょう!

 

 

※解説ページで紹介しているコードはできるだけコピペで実際に動作を確認するようにしましょう。実際に動かすのと読むのだけでは理解に大きな差が出てきます

まずはHTMLから身につけよう!

すでにHTMLを使ってウェブページを作ったことがある人はこの項目をスキップしても大丈夫です。未経験の人はプログラミングの第一歩です、1つずつ順番に見てください。

HTML学習 #1

HTML学習 #2

HTML学習 #3

HTML学習 #4

 

 

CSSを身につけよう!

HTMLに続いてCSSもホームページ作成でバッチリだよ!という人はスキップしても大丈夫です。

CSS学習 #1

CSS学習 #2

CSS学習 #3

CSS学習 #4

CSS学習 #5

CSS学習 #6

CSS学習 #7

CSS学習 #8

CSS学習 #9

 

 

エディターを使って開発環境を整えよう。

そろそろコード編集ようのエディターを使いましょう。既に使っているという人は軽く目を通しておいてください。

コードエディターを使ってみよう。

 

 

JavaScript(jQuery)を身につけよう!

いよいよプログラミング言語です、張り切っていきましょう。

HTML、CSS未経験の人は先にそちらを学習してください。

JavaScript基礎 解説概要
JavaScript学習 #1 前置き、解説方針
JavaScript学習 #2 console、数値計算、文字列
JavaScript学習 #3 変数
JavaScript学習 #4 関数、ブロック
JavaScript学習 #5 条件式if文、演算子
JavaScript学習 #6 論理演算子、else if文
JavaScript学習 #7 引数(関数)
JavaScript学習 #8 関数内関数
JavaScript学習 #9 関数スコープ
JavaScript学習 #10 戻り値、forループ
JavaScript学習 #11 forループ+if文
JavaScript学習 #12 if内if、for内for
JavaScript学習 #13 カウントアップ
JavaScript学習 #14 return、break、continue
JavaScript学習 #15 配列
JavaScript学習 #16 メソッド、プロパティ、length、配列の追加
JavaScript学習 #17 配列の削除、pop、shift、splice
JavaScript学習 #18 多次元配列
JavaScript学習 #19 連想配列
JavaScript学習 #20 配列のコピー、オブジェクト型、プリミティブ型

 

一旦ここでUserScriptを使えるようにアドオンを導入しておきましょう。

Tampermonkey Greasemonkey の使い方 userscriptの書き方

 

JavaScript実践 解説概要
JavaScript学習 #21 前置き
JavaScript学習 #22 DOM操作、要素の取得、getElement
JavaScript学習 #23 querySelector、style
JavaScript学習 #24 時間を表示させる、Date()、setInterval()
JavaScript学習 #25 数値の0詰め、toString()、setTimeout()
JavaScript学習 #26 イベントリスナー、onclick、location
JavaScript学習 #27 DOM操作、要素の追加と削除
JavaScript学習 #28 attribute、ライブラリの追加、innerHTML
JavaScript学習 #29 replace、正規表現
JavaScript学習 #30 const、let、アロー関数
JavaScript学習 #31 練習問題、split、indexOf、slice
JavaScript学習 #32 練習問題、配列の並び替え、sort
JavaScript学習 #33 練習問題、スナイプ、click、入力されたテキストの取得
JavaScript学習 #34 練習問題、ファイルパスの変更、for-of、classList
JavaScript学習 #35 非同期通信Ajax、match
JavaScript学習 #36 データ保存、localStorage、属性指定のセレクタ
JavaScript学習 #37 JSON形式、stringify、parse
JavaScript学習 #38 ローカルファイル保存・読み込み、blob、FileReader
JavaScript学習 #39 雑談