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

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

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

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

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

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

November 14, 2016

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

See All by 北海道科学大学　電子計算機研究部
第12回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
1
64
第11回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
74
第10回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
50
第09回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
1
170
第08回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
55
第07回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
51
第06回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
74
第05回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
55
第04回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
120

Other Decks in Education

See All in Education
Why the humanities may be your best career bet
Avatar for Jay Heinrichs figarospeech
0
190
プロポーザルを書く技術とアンチパターン/proposal-writing-and-antipatterns
Avatar for moriyuya moriyuya
12
3k
偶然のチャンスを掴みに行けるのは君だ！
Avatar for ことみん / kotomin_m kotomin_m
2
110
Padlet opetuksessa
Avatar for Matleena Laakso matleenalaakso
12
15k
면접관 눈에 띄는 데이터 분석 포트폴리오 만드는 법 | 2026년 5월 세미나
Avatar for 데이터리안 datarian
0
400
教育現場から見た Ruby on Rails
Avatar for YassLab yasslab
PRO
0
150
Curso de Consagração ao Sagrado Coração de Jesus - O Sagrado Coração na História (Aula 01)
Avatar for Congregação Mariana da Imaculada Conceição e Santo Afonso de Ligório cm_manaus
0
160
良い塩梅を実現する、AWSネットワーク3分クッキング
Avatar for モブエンジニア（Masaki Okuda） masakiokuda
1
250
SARA Annual Report 2025-26
Avatar for SARA Institute sara2023
1
340
fake vs real
Avatar for Olivier Latourelle latrrr
0
130
Protecting Patrons with Digital Vendors
Avatar for Dorothea Salo dsalo
0
150
From Days to Minutes: How We Taught an AI to Onboard 50+ Tenants on our AI Features
Avatar for Miguel Cabrera mfcabrera
0
140

Featured

See All Featured
WENDY [Excerpt]
Avatar for Tessa Abrams tessaabrams
10
37k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
41
2.5k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.5k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.4k
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
180
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.2k
Side Projects
Avatar for Sacha Greif sachag
455
43k
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.2k
Game over? The fight for quality and originality in the time of robots
Avatar for Wayne Barker wayneb77
1
180
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.4k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
1
360

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