04.javascriptで電卓アプリ:index.html

差分

このページの2つのバージョン間の差分を表示します。

この比較画面にリンクする

--- 04.javascriptで電卓アプリ:index.html [2018/12/08]
adash333 [04.Javascriptで電卓アプリ]
+++ 04.javascriptで電卓アプリ:index.html [2018/12/08]
adash333 [3. calculator.htmlファイル（HTMLファイル、ホームページのファイル）を作成]
@@ 行 10: / 行 10: @@
 ===== 方針をたてる =====
-手書きでデザインを下書き
+手書きでデザインを下書きしてみるのがお勧めです。
+  -題名『電卓アプリ』
+  -電卓を表示する場所
+  -計算式と結果を表示する場所(<input type="text" name="text">)
+  -数字ボタンや+-×÷=ボタン、クリアボタン
 <code>
@@ 行 21: / 行 25: @@
 </code>
-作成中
+今回は、[[https://algorithm.joho.info/programming/javascript/simple-calculator/|こちらのサイト]]のソースコードを利用させていただこうと思います。
+eval関数という、指定した文字列が「 JavaScriptのプログラムコードとして正しいか 」を評価した上で それを実行する関数を用いますが、使用するにはリスクもあるようです。(参考:[[http://www.recipi.jp/7879|JavaScript【 eval 】 ～ ソースコードの評価と実行]])
 ソースコード
@@ 行 37: / 行 46: @@
 Windowsパソコンでも、Macでも、できれば、Chromeというブラウザをインストールして、Chrome上で操作を行ってください。
+ただし、プログラミングには『タイプミスによってプログラム全体が動かない』ことが非常によくおこります。
+VisualStudioCodeというソフトを用いてプログラミングを行うと、タイプミスがあると、下に赤い波線が表示されて、指摘してくれることが多いので、タイプミスが減ります。
+実際にプログラミングを行うときは、https://azure.microsoft.com/ja-jp/products/visual-studio-code/からインストールして、VisualStudioCode上でプログラムを打ち込んで保存してから、GitHub上にコピペするのがお勧めです。
 ==== 1.GitHubアカウントは作成済みとします ====
 GitHubアカウントの作成方法については、[[:index.html|このサイトについて]]をご覧下さい。
@@ 行 53: / 行 67: @@
   -name your file... のところに、calculator.html と記入し、
-  -下の方に、以下のコードをがんばって打ちこみます（<head></head>で囲まれた部分はコピべがお勧めですが、<body>以下の部分は、キーボードで打ち込んでみるのがお勧めです。）
+  -下の方に、以下のコードをコピペします
   -入力し終わったら、下の方へ移動して、
   -Commit new file をクリック
+<html>
+<script src="https://gist.github.com/adash333/69c4a5df13a0e6d3c105260f318f7f94.js"></script>
+</html>
+==== 4.Bulmaのcolumn(カラム)システムを用いて計算結果とボタンをデザイン ====
+参考(公式サイト):https://bulma.io/documentation/columns/

04.javascriptで電卓アプリ/index.html.txt · 最終更新: 2018/12/08 by adash333