$30 off During Our Annual Pro Sale. View Details »

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

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

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

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

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

November 14, 2016
Tweet

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

See All by 北海道科学大学　電子計算機研究部
第12回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
1
61
第11回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
72
第10回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
48
第09回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
1
160
第08回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
52
第07回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
49
第06回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
74
第05回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
54
第04回Network講座2019
Avatar for 北海道科学大学　電子計算機研究部 densan
0
120

Other Decks in Education

See All in Education
Design Guidelines and Models - Lecture 5 - Human-Computer Interaction (1023841ANR)
Avatar for Beat Signer signer
PRO
0
1.2k
【dip】「なりたい自分」に近づくための、「自分と向き合う」小さな振り返り
Avatar for ディップ株式会社 dip_tech
PRO
0
200
令和エンジニアの学習法 〜 生成AIを使って挫折を回避する 〜
Avatar for Yuduru moriga_yuduru
0
200
卒論の書き方 / Happy Writing
Avatar for kaityo256 kaityo256
PRO
51
27k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.1k
1202
Avatar for cbtlibrary cbtlibrary
0
160
1125
Avatar for cbtlibrary cbtlibrary
0
140
The knowledge panel is your new homepage
Avatar for Brad Wetherall bradwetherall
0
220
JavaScript - Lecture 6 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.1k
ロータリー国際大会について～国際大会に参加しよう～：古賀 真由美 会員（2720 Japan O.K. ロータリーEクラブ・(有)誠邦産業 取締役）
Avatar for 2720 Japan O.K. ロータリーEクラブ 2720japanoke
1
750
核軍備撤廃に向けた次の大きな一歩─核兵器を先には使わないと核保有国が約束すること
Avatar for HKano hide2kano
0
190
あなたの言葉に力を与える、演繹的なアプローチ
Avatar for Takuto Nagami logica0419
1
250

Featured

See All Featured
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
1
1.5k
Designing for Performance
Avatar for Lara Hogan lara
610
69k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
560
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
71
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6k
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
1
270
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
110
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
Avatar for soudai sone soudai
PRO
61
41k
A Soul's Torment
Avatar for Nat Ma seathinner
1
2k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.1k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.1k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
150

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