2021年2月25日 星期四

版控基本使用方式

Git 版控基本使用方式
  1. 安裝 git 軟體:
    • git 官方網站
    • 下載 64-bit Git for Windows Setup 版本
    • 執行安裝流程:
      1. 版權宣告頁,按 Next 進行下一步:
      2. 設定安裝目錄,保留預設路徑即可:
      3. 選擇安裝元件:
      4. 設定程式清單列表中的軟體名稱!保留預設名稱即可!
      5. 選擇適當的文字編輯器!請選擇你喜歡使用的軟體,如果還沒安裝,可以先選 Notepad !!
      6. 選擇主要分支的名稱為何!請儘量從善如流,使用 main 做為主分支名稱!
      7. 設定環境變數,讓你可以在文字介面中可以使用 git 指令,也可以讓第三方軟體呼叫 git 指令!
      8. 設定使用 https 通訊連線至 Git Server 時,想要使用哪一種加密函式庫!使用預設值即可!
      9. 選擇換行的符號!若是使用 windows 平台,需要上傳資料到 Unix 平台上的 Git Server ,請選用第一項目!
      10. 選擇使用哪一種文字介面來操作 git 指令!因為是在 windows 平台上安裝,所以,使用命令提示字元的文字介面即可!
      11. 選擇當下達指令 git pull 下載 git server 上的資料時,在主機上的資料處理方式!如果沒其他想法,可以保留預設值即可!
      12. 選擇憑證管理方式!沒有想法,就使用新的管理方式!
      13. 針對檔案系統的連結,原則上保留預設值即可!
      14. 提供使用經驗給開發團隊!新手應詃是選擇預設值即可!
      15. 這個綠色的條.....
      16. 按下 Finish 即可完成安裝!
  2. 安裝 TortoiseGit :方便使用 git 的圖形介面軟體!
    • TortoiseGit 官方網站
    • 下載 stable 版本,以及所需要的語系檔!
    • 執行安裝流程:
      1. 首先安裝主要程式:
         
      2. 程式打開後,有歡迎頁,按 Next 下一步驟!
      3. 出現版權宣告頁!沒問題可以直接按 Next 進行下一步驟!
      4. 選擇 SSH 連線時的客戶端軟體!使用預設值即可!
      5. 選擇安裝的元件以及安裝目錄!選擇安裝全部的套件比較有利!
      6. 上述過程如果沒任何問題,即可按下 Install 按鍵,進行安裝!
      7. 安裝之前,需要確認一下安全性!請按「是」,同意才會接續安裝!
      8. 安裝完成時,會提示第一次啟動精靈!
      9. 選擇語系!此時,先不要按「下一步」!先保留該視窗!
      10. 進行語系檔案的安裝!
      11. 左方的視窗按「下一步」!
      12. 再次跳出安全性確認,請按下「是」,接著下一步驟
      13. 左方的語系安裝視窗己安裝完成,請按下「完成」即可!
      14. 回到主程式的選擇語系視窗,按下「Refresh」按鍵,即可看到其他語系的選項!
      15. 出現歡迎使用畫面!
      16. 確認 Git.exe 檔案置放路徑!按下「立即檢查」,由 TortoiseGit 幫忙確定!
      17. 設定使用者資訊的畫面,可以先略後,後續再進行設定!
      18. 設定連上 git server 的認證與憑證設定!可以先略過,後續再針對個別的專案,進行不同的設定!
      19. 按下完成之後,可在視窗空白處按下滑鼠右鍵,查看是否有新增的功能項目!
  3. 使用 VSCode 中的 git 功能:
    • 新增一空白資料夾
    • 在 VSCode 中,開啟該資料夾
    • 利用 <Ctrl> + <Shift> + <G> 開啟版控功能進行初始化設定
    • 經過 git 初始化之後,即可以使用各項版控控制元件與語法!
  4. 使用 github 網站:
    • github 官方網站
    • 請選擇 sign up 進行註冊
    • 新增一個 Repository !
    • 將新增的 Repository ,clone 到自己的電腦上!
    • 修改 README.md 檔案後,上傳到 github !!
相關資料索引
參考文獻:
  1. 連猴子都能懂的Git入門指南

2021年2月24日 星期三

VSCode 安裝與設定

VSCode 安裝
  1. 下載網址:
  2. 點擊執行安裝工作,可一鍵執行完成!

VSCode 設定
  1. 開啟 VSCode
  2. 執行 Extensions
  3. 輸入 HTML5
  4. 選擇 HTML Snippets 後,按下 install 按鍵
  5. 新增一個 HTML 網頁檔案,檔名可命名為 index.html
  6. 使用快速鍵,編寫網頁內容:在游標閃爍處,輸入 html 字樣,就有快選視窗跳出! 或是按下 Ctrl + Space 兩個按鍵,也會出現快選視窗!
  7. 請選擇 「html:5」項目,檔案內容應自動填上!
  8. 請儲存檔案
  9. 直接使用瀏覽器查看!
相關資料索引
參考文獻:
  1. 課程練習題
  2. VSCode Windows 使用者手冊

2021年2月19日 星期五

初階 Web APP 前端開發目錄與資料索引

HTML5 基本語法
  1. 開發環境的安裝
  2. HTML5 基礎語法介紹
  3. HTML5 基本樣式運用介紹
  4. HTML5 文字段落樣式運用介紹
  5. HTML5 色彩圖案樣式運用介紹
  6. HTML5 表格與清單列表運用介紹
  7. HTML5 元件分類與定名運用介紹
  8. HTML5 CSS 與 JavaScripts 的嵌入
  9. HTML5 表單應用
CSS3 基本語法
  1. CSS3 基本認知與介紹
  2. CSS3 顏色與背景設定方式
  3. CSS3 網頁 Box 模式概念與設定
  4. CSS3 網頁內容樣式設定
  5. CSS3 網頁內容置放樣式設定
  6. CSS3 網頁整體樣式設定
  7. CSS3 進階功能樣式設定

Bootstrap 基本語法
  1. Bootstrap 基本概念與認知
  2. Bootstrap 基本文字、顏色與背景用法
  3. Bootstrap 常用的框鍵用法
  4. Bootstrap 常用的「運作中」表示用法
  5. Bootstrap 常用的表列用法
  6. Bootstrap 常用的表格方框用法
  7. Bootstrap 常用的互動對答框用法
  8. Bootstrap 其它常用工具用法
  9. 轉往下個階段課程--JavaScripts

相關資料索引
參考文獻:
  1. 課程練習題
  2. 參考書籍
  3. 參考網頁

進階 Web APP 前端開發目錄[請按這裡]