Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
第五回後期ネットワークチーム講座
Search
北海道科学大学 電子計算機研究部
November 21, 2016
Education
0
52
第五回後期ネットワークチーム講座
北海道科学大学 電子計算機研究部
November 21, 2016
Tweet
Share
More Decks by 北海道科学大学 電子計算機研究部
See All by 北海道科学大学 電子計算機研究部
第12回Network講座2019
densan
1
57
第11回Network講座2019
densan
0
70
第10回Network講座2019
densan
0
46
第09回Network講座2019
densan
1
160
第08回Network講座2019
densan
0
49
第07回Network講座2019
densan
0
46
第06回Network講座2019
densan
0
71
第05回Network講座2019
densan
0
51
第04回Network講座2019
densan
0
110
Other Decks in Education
See All in Education
EVOLUCIÓN DE LAS NEUROCIENCIAS EN LOS CONTEXTOS ORGANIZACIONALES
jvpcubias
0
130
Transición del Management al Neuromanagement
jvpcubias
0
190
チーム開発における責任と感謝の話
ssk1991
0
130
20250830_MIEE祭_会社員視点での学びのヒント
ponponmikankan
1
140
2025年度春学期 統計学 第8回 演習(1) 問題に対する答案の書き方(講義前配付用) (2025. 5. 29)
akiraasano
PRO
0
130
サンキッズゾーン 春日井駅前 ご案内
sanyohomes
0
850
AIの時代こそ、考える知的学習術
yum3
2
190
今までのやり方でやってみよう!?~今までのやり方でやってみよう!?~
kanamitsu
0
140
プレゼンテーション実践
takenawa
0
15k
自己紹介 / who-am-i
yasulab
PRO
3
5.4k
社外コミュニティの歩き方
masakiokuda
1
180
RSJ2025 ランチョンセミナー 一歩ずつ世界へ:学生・若手研究者のための等身大の国際化の始め方
t_inamura
0
160
Featured
See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
How to Ace a Technical Interview
jacobian
279
23k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
185
54k
RailsConf 2023
tenderlove
30
1.2k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
Why Our Code Smells
bkeepers
PRO
339
57k
Navigating Team Friction
lara
189
15k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
51
5.6k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Transcript
ネットワークチーム 後期第五回講座資料 アプリケーション作成
目次 • アプリケーション作成 • 用語解説
準備 1. 作業用フォルダでコマンドプロンプトを開く 2. npm init を実行 (その後は特にこだわりがなければ全てEnterでよい)
package.json • npm init を実行すると package.json が作られる • JSONは、JavaScript のオブジェクトと同様の記法で書か
れたテキストファイル プログラムにデータを渡す際などに使用される
package.json の中身 → 入っていないモジュールがある 場合、以下を実行 npm install --save モジュール名
package.json • 内容を見ると、現在インストールしているモジュールが “dependencies :” に書き込まれている 新たにモジュールを追加する場合、インストール時に ”--save” オプションを使用する •
npm update で一括アップデート、npm start で実行 etc…
Pug(旧Jade)の記法 ①基本的にタグ名のみ記述 (<>いらず、閉じタグもなし) ② インデントを用いて階層構造を表現する ③タグ名の後に( )を付けて属性の指定ができる
Pug(Jade)の記法 ④ 簡単な制御構文(While, If など)や変数、JSコードが利用で きる JSのコードは先頭に” – “(ハイフン)を付けて記述する ⑤
変数を呼び出す場合、 #{変数名} または =変数名 と記述 ⑥ コマンドを用いることでテンプレートの継承ができる
• app.js を次の2ページの通り記述 一つのjsファイルに続けて書く (全28行)
None
None
• 次に、app.js があるフォルダ内に 「views」 というフォルダを作成 (ついでに 「public」 というフォルダも作成)
Pugファイル作成 • views/index.pug (全4行)
Pugファイル作成 • views/layout.pug (全10行)
CSS作成 • public/css/style.css
レンダリング • テンプレートエンジンからHTMLを生成すること • render関数でこれが行われている
レンダリング • render関数から渡された値はpugファイルで指定された場所に 代入される
ルーティング • リクエストされたURLに対して呼び出すアクションを変更する仕組 Localhost:3000/ にアクセスした場合 ↓ Localhost:3000/hello/ にアクセスした場合 ↓