こんにちは。KOUKIです。とある企業でWeb系のエンジニアをしています。
学習ソースはUdemyが多く、最近は「50 Projects In 50 Days – HTML, CSS & JavaScript」というコースでJavaScriptを勉強しています。GitHubは「こちら」。
本記事では、このコースで学んだことについて記事にしていきたいと思います。
今回は、開発環境の構築です。これから記事にする全てのアプリケーションで共通して使う設定になると思います。
<目次>
JavaScriptまとめ
環境構築
ファイル準備
次のファイルを用意してください。
1 2 3 |
touch index.html touch script.js touch style.css |
ボイラープレートの記述
index.html/style.cssにデフォルトの設定を書いておきましょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<!-- index.html --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Project Stater</title> </head> <body> <h1>Project Stater</h1> <script src="script.js"></script> </body> </html> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
// style.css @import url("https://fonts.googleapis.com/css?family=Muli&display=swap"); * { box-sizing: border-box; } body { font-family: "Roboto", sans-serif; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; overflow: hidden; margin: 0; } |
環境構築は、以上です。
コメントを残す
コメントを投稿するにはログインしてください。