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
Web Programming - Lesson 7
Search
Ryan Chung
May 07, 2020
Technology
1
630
Web Programming - Lesson 7
Ryan Chung
May 07, 2020
Tweet
Share
More Decks by Ryan Chung
See All by Ryan Chung
MovieBot Development
ryan403
0
300
Design Voice-First Games for Alexa
ryan403
0
63
AI Teaching Talk
ryan403
0
120
Cognitive Service
ryan403
0
100
jQuery & API Practices
ryan403
0
140
CSS Practices
ryan403
1
160
JavaScript Practices
ryan403
0
100
Web Programming - Lesson 6
ryan403
1
620
Web Programming - Lesson 5
ryan403
1
440
Other Decks in Technology
See All in Technology
AWSでAgentic AIを開発するための前提知識の整理
nasuvitz
2
160
【Kaigi on Rails 事後勉強会LT】MeはどうしてGirlsに? 私とRubyを繋いだRail(s)
joyfrommasara
0
270
Railsの話をしよう
yahonda
0
140
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
Simplifying Cloud Native app testing across environments with Dapr and Microcks
salaboy
0
160
いまからでも遅くない!SSL/TLS証明書超入門(It's not too late to start! SSL/TLS Certificates: The Absolute Beginner's Guide)
norimuraz
0
240
スタートアップにおけるこれからの「データ整備」
shomaekawa
2
480
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
2.8k
プロポーザルのコツ ~ Kaigi on Rails 2025 初参加で3名の登壇を実現 ~
naro143
1
240
E2Eテスト設計_自動化のリアル___Playwrightでの実践とMCPの試み__AIによるテスト観点作成_.pdf
findy_eventslides
2
630
"プロポーザルってなんか怖そう"という境界を超えてみた@TSUDOI by giftee Tech #1
shilo113
0
200
Performance Insights 廃止から Database Insights 利用へ/transition-from-performance-insights-to-database-insights
emiki
0
280
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
Agile that works and the tools we love
rasmusluckow
331
21k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.7k
Producing Creativity
orderedlist
PRO
347
40k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
How to train your dragon (web standard)
notwaldorf
97
6.3k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
Designing for Performance
lara
610
69k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
How STYLIGHT went responsive
nonsquared
100
5.8k
Transcript
Web Programming –
[email protected]
行動開發學院 行動開發學院 JavaScript Lab 網站上線 Ryan
Chung 123
Web Programming –
[email protected]
行動開發學院 行動開發學院 目標 • 將完成的網站上線 –
很多選擇 • Ngrok • GitHub Pages • Self Own Server(IIS, WAMP,…) • Hosting Service + Domain Name • Azure • AWS • GCP • CHT 124
Web Programming –
[email protected]
行動開發學院 行動開發學院 使用 GitHub Pages 125
https://pages.github.com/
Web Programming –
[email protected]
行動開發學院 行動開發學院 註冊一個GitHub帳號 126 https://github.com/join
Web Programming –
[email protected]
行動開發學院 行動開發學院 登入後,建立一個新的專案 • 點選照片旁邊的+,New repository
127 https://github.com/new
Web Programming –
[email protected]
行動開發學院 行動開發學院 安裝git • 網頁拉至中間部分,右邊有下載連結 •
下載後開啟,一步一步安裝至本機 128 https://git-scm.com/
Web Programming –
[email protected]
行動開發學院 行動開發學院 在VS Code中打開終端機 • 打開VS
Code,檔案->開啟資料夾 • 選擇自己的專案 • 檢視->終端 (或按下Ctrl + ` ) 開啟內建終端機 129
Web Programming –
[email protected]
行動開發學院 行動開發學院 在終端機中設定git git config --global
user.name "你的英文姓名" 130 然後再輸入: git config --global user.email “你的電子郵件"
Web Programming –
[email protected]
行動開發學院 行動開發學院 開始使用git (這些指令都下在終端機) • Git
初始化 git init • 加入所有檔案 git add . • 設定上傳描述標記 git commit –m "First commit" • 對應遠端位置 git remote add origin https://github.com/YourUserName/YourProgectName.git • 上傳檔案 – git push –u origin master 131 這個網址就是 https://github.com/你的使用者名稱/你的專案名稱.git
Web Programming –
[email protected]
行動開發學院 行動開發學院 設定GitHub Pages • 在Github網站中,進入自己的專案
• 點擊 Settings • 下拉至GitHub Pages • 將Source設定為 master branch • 再下拉網頁,找到產生的網址 132
Web Programming –
[email protected]
行動開發學院 行動開發學院 測試網站是否已上線 • 打開瀏覽器,輸入網址 https://YourUserName.github.io/YourProjectName
網址就是 https://你的帳號名稱.github.io/你的專案名稱 133
Web Programming –
[email protected]
行動開發學院 行動開發學院 之後要怎麼更新網站內容? • 一樣在VS Code中開啟終端機(Ctrl
+ `) • 依序輸入以下指令 • 加入所有檔案 git add . • 設定上傳描述標記 git commit –m "Update for xxx" • 上傳檔案 – git push –u origin master 134
Web Programming –
[email protected]
行動開發學院 行動開發學院 Recap • GitHub –註冊帳號
–建立Repo • 本機端 –終端機下指令 –建立Git、對應遠端、加入、標記、上傳 • GitHub –設定 –GitHub Page、Source Master Branch 135