Upgrade to Pro — share decks privately, control downloads, hide ads and more …

第四回後期ネットワークチーム講座

北海道科学大学　電子計算機研究部
November 14, 2016
Education
0
45

 第四回後期ネットワークチーム講座

北海道科学大学　電子計算機研究部

November 14, 2016
Tweet

More Decks by 北海道科学大学　電子計算機研究部

See All by 北海道科学大学　電子計算機研究部
第12回Network講座2019
densan
1
40
第11回Network講座2019
densan
0
65
第10回Network講座2019
densan
0
34
第09回Network講座2019
densan
1
130
第08回Network講座2019
densan
0
41
第07回Network講座2019
densan
0
41
第06回Network講座2019
densan
0
49
第05回Network講座2019
densan
0
41
第04回Network講座2019
densan
0
63

Other Decks in Education

See All in Education
Data Management and Analytics Specialisation
signer
PRO
0
990
自己紹介 / who-am-i
yasulab
2
3.1k
TCA Practice in 5 min
d_date
1
610
Design Guidelines and Principles - Lecture 7 - Information Visualisation (4019538FNR)
signer
PRO
0
1.7k
Introduction - Lecture 1 - Information Visualisation (4019538FNR)
signer
PRO
0
3.6k
Pre-enrollment Information for UTokyo International Students
utokyoissr2360
0
4.8k
2024年度春学期　統計学　第2回　統計資料の収集と読み方（授業前配付用） (2024. 4. 18)
akiraasano
PRO
0
100
Multimodal Interaction - Lecture 3 - Next Generation User Interfaces (4018166FNR)
signer
PRO
0
1.1k
Monaca Educationを活用したプログラミング授業実践
asial_edu
0
210
Copilotとして理解する生成AI利用の基本
gmoriki
1
160
前期教育実習事前指導0221
naradai
0
140
Sähköiset kyselyt, kokeet ja arviointi
matleenalaakso
1
16k

Featured

See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
28
4k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
245
20k
Automating Front-end Workflow
addyosmani
1357
200k
Product Roadmaps are Hard
iamctodd
45
9.7k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
34
6k
What’s in a name? Adding method to the madness
productmarketing
PRO
17
2.7k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
The Power of CSS Pseudo Elements
geoffreycrofte
62
5k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
34
8.9k
The MySQL Ecosystem @ GitHub 2015
samlambert
244
12k
Writing Fast Ruby
sferik
622
60k
Thoughts on Productivity
jonyablonski
60
3.9k

Transcript

  1. ネットワークチーム 後期第四回講座資料 HTML、Jade

  2. 目次 • HTML • Jade

  3. HTML （HyperText Markup Language） • Webページを作成するための言語。 • 今日のWebページの多くはHTMLで作成されている。 • 「タグ」というものを使って記述する

  4. HTML （HyperText Markup Language） <!DOCTYPE html> <html lang=“ja”> <head> <meta

    charset=“utf-8”> <title>densan</title> </head> <body> <h2>電算ネットワークチーム</h2> <p>電子計算機研究部へようこそ</p> </body> </html>

  5. ＭＶＣモデル • “Model” “View” “Controler” の略 • プログラミングを行う際に、プログラムを 1. 実際の処理、データベースへのアクセス（Model）

    2. 入力の受け取り、ModelとViewの制御（Controler） 3. クライアントへの情報の表示（View） この3つの機能に分割して作成することをいう。

  6. MVCモデル • Koa.jsのみではViewの機能が実現できないため、 外部のテンプレートエンジンを利用する必要がある。 1. Jade 2. EJS 3. Hogan.js

    4. ECT …など

  7. Jadeの記法 ①基本的にタグ名のみ記述 （<>いらず、閉じタグもなし） ② インデントを用いて階層構造を表現する ③タグ名の後に( )を付けて属性の指定ができる

  8. Jadeの記法 ④ 簡単な制御構文（While, If など）や変数、JSコードが利用で きる JSのコードは先頭に” – “（ハイフン）を付けて記述する ⑤

    変数を呼び出す場合、 #{変数名} または =変数名 と記述 ⑥ コマンドを用いることでテンプレートの継承ができる

  9. パッケージの入れ方 （Sublime Text） 1. Sublime Textを起動してCtrl キー + shift キー

    + P を押す
  10. None

  11. パッケージの入れ方 （Sublime Text） 2. フォームに install と入力する 3. Package Control:

    Install Packageを選択する
  12. None

  13. パッケージの入れ方 （Sublime Text） 4. Jade と入力して出てくる選択肢の一番上をクリック

  14. y