# iOS App Development 101
# Day 0: Tools
> A good tool improves the way you work. A great tool improves the way you think.
Jeff Duntemann
1. Install following tools to your mac:
1. https://apps.apple.com/tw/app/xcode/. This is a very big app and could take hours to download & install.
2. When install, ~~add iOS app 16.4 to your installation~~ don't download any simulator if you have an iphone nearby. We'll use iphone device instead of simulator.
2. Use translator / ChatGPT to translate anytime you need. This is not an English lesson. Use the following ChatGPT prompt to help translate:
```
我希望你能充當一名繁體中文翻譯，拼寫修正者和改進者。我將用英文與程式語言與你對話，你將翻譯它，並以改進的版本回答，以繁體中文表達。我希望你能用簡單清楚的繁體中文詞語替換我簡化的詞語和句子。保持意義不變。我只希望您回答糾正和改進，不要寫解釋。輸出格式如下：
{英文原文段落}
{繁體中文翻譯段落}
```
3. Register new account on [Github](https://github.com). Send your github account or page url to @chechiachang.
4. Press Shift-Command-4 to capture a portion of screen. This is very helpful to record your questions.
### Mindset
1. 學習過程中有步驟不理解，或是卡住都很正常，甚至可說沒遇到問題才不正常。請隨手記下有問題的部分，然後嘗試解決或跳過卡住的部分。
1. 遇到問題，嘗試解決很重要。請沿途紀錄你嘗試解決問題的方法，就算最終無法解決問題，嘗試的方法也很有價值。
1. 嘗試 google search 遇見的問題，搜尋關鍵字英文來嘗試找答案
1. 如果找不到解答，可以嘗試加入關鍵字：iOS，app，xcode，swift，apple training...等
1. 嘗試解決問題後，如果無法再一兩次嘗試解決，請先試著跳過問題。直接嘗試後面的進度。
# Day 1: app developer training by apple
> The secret of getting ahead is getting started.
Mark Twain
We will do ios app training with official apple lesson on https://training.apple.com/appdeveloper
### Table of Content (TOC)
Read this page in 5 mins: https://developer.apple.com/tutorials/app-dev-training/
It's ok if don't understand after reading. Take a guess about and write down what you think this page is about. (不要超過 50 字中文)
Don't waste more time in this page.
Click "Get started" on the top of the page.
### Getting started with Scrumdinger
Read this page in 5 mins: https://developer.apple.com/tutorials/app-dev-training/getting-started-with-scrumdinger
Click "Get started" on the bottom of the page.
### SwiftUI essentials. Using stacks to arrange views
Try complete this page https://developer.apple.com/tutorials/app-dev-training/using-stacks-to-arrange-views
Create project
- if your have store=none
# Day 2: Preview
> Imagination is everything. It is the preview of life's coming attractions.
Albert Einstein
### Run app on your iphone
You can run xcode preview an iphone simulator on your mac, that is, your mac will run a tiny iphone inside your mac. However, this could cause your mac running slow since simulate an iphone 15 might overload your mac.
You can run xcode preview on you iphone by doing the following step:
Go to xcode and configure Scrumdinger project to run preview in your iphone
1. On left panel (navigator area), click top project Scrumdinger. The middle area (editor area) will change to project configuration, you can see a group of dropdown list.
2. Click "general" and find "minimal developments" change iOS to 16.4. Minimal iOS version must be less than your iphone iOS version.
1. iphone v16.4 can run app v16.4 and app v16.3...
2. can't run app v17.0.
3. On top panel (toolbar), find Scrumdinger > Any Simulator Device
1. change Any Simulator device to your iphone
Configure your iphone, on your iphone
1. Settings -> Privacy & Security -> Developer Mode
1. change from "off" to "on"
1. Connect your iphone to mac with usb / wifi.
1. when connected to mac, trust this mac
Then start using preview
1. Unlock your iphone
2. Go to MeetingView
3. Start / Pause preview by `option + command + p`
4. Your xcode will prepare your iphone by sending data and your new app (Scrumdinger) to iphone
5. Xcode say "Previewing on your iphone"
6. check your app on your iphone
7. You can close Scrumdinger on your iphone like other app.
8. On home screen you will see two new app installed by xcode:
1. Xcode Previews (tool installed by xcode)
1. Scrumdinger
[Panel of Xcode](https://developer.apple.com/documentation/xcode/configuring-the-xcode-project-window)
# Day 3: Complete Using stacks to arrange views
https://developer.apple.com/tutorials/app-dev-training/using-stacks-to-arrange-views
Try type some element / syntax with your own hands.
Try play around this page by
1. adding Text() to other line to see changed view
2. change font of some Text()
3. adding more HStack / VStack
4. adding .padding
5. deleting some line, read the error message, and revert to fix the error
6. doing some exploration
# Day 4:
Q: Preview 不見怎麼辦？
A: Toolbar (top) -> Editor -> Canvas
# Day 5: Swift 4 programming bootcamp
Now you've learned how to programming to generate view of app. However, you might quite understand the code you wrote. Now, we can learn some swift syntax follow this free lesson:
https://www.udemy.com/course/swift-5-programming-bootcamp-for-beginners/learn/lecture/19357758#overview
We will use another tool called swift playground.
- [Download swift playground](https://apps.apple.com/tw/app/swift-playgrounds/id1496833156?mt=12)
Tips
- Type all video example code to your swift playground
- ⌘+R to run your code
- You can watch lesson videos with 2x speed
- You can turn on subtitle for lesson videos
# (10/1) Day 6: How to make an app for udemy
https://www.udemy.com/course/how-to-make-an-app-for-beginners-iosswift-2019/
# References
Outline
- [Appworks School iOS 興趣初探](https://drive.google.com/file/d/1u2-61AG_Rg69MgZtuOpv8U_vznLfxtYD/view)
- [Appworks School iOS #23](https://drive.google.com/file/d/1o8Fq4Hwt4_0T9aKg0t561nPX_WKyS9dh/view)
---
# (03/10)Day 101: 2024職缺市場調查
參考文章
- [2024/03/06 APP 工程師找工作 大全 - iOS/Android 工程師薪水、應用程式發展趨勢一次掌握](https://www.cakeresume.com/resources/mobile-app-developers-salary-jobs-interview?locale=zh-TW)
- [2024 工程師求職管道：工程師找工作必看的職缺彙整大全](https://www.cakeresume.com/resources/programmer-developer-engineer-job-search-resources)
- [職場心得分享 Ptt Soft_Job](https://term.ptt.cc/)
- https://zh.wikipedia.org/zh-tw/JavaScript
求職平台
- https://www.cakeresume.com
- https://www.yourator.co
- [Swift: 30](https://www.yourator.co/jobs?area[]=TPE&sort=most_related&term[]=swift)
- [Flutter: 12](https://www.yourator.co/jobs?area[]=TPE&sort=most_related&term[]=flutter)
- [前端工程師: 100+](https://www.yourator.co/jobs?area[]=TPE&sort=most_related&term[]=%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%B8%AB)
- [後端工程師: 100+](https://www.yourator.co/jobs?area[]=TPE&sort=most_related&term[]=%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%B8%AB)
- https://www.104.com.tw
- Swift: 525
- Flutter: 304
- React: 1505
- Vue: 2139
- 前端工程師: 2390
- app工程師: 1078
- ios工程師: 518
- android工程師: 709
- https://meet.jobs/zh-TW
- https://tw.indeed.com
短期目標
- App: 讀秒遊戲
- Front-End: 英文單字打字練習遊戲
# (03/12)Day 103: Example Apps
- https://developer.apple.com/tutorials/sample-apps
- [About Me](https://developer.apple.com/tutorials/sample-apps/aboutme)
# (3/20) Day 104: 非工程師的軟體入門指南
[https://school.appworks.tw/gettingstartedwithengineering/](https://school.appworks.tw/gettingstartedwithengineering/)
## 軟體應用程式概覽
### 1. 軟體應用程式的運作方式
軟體應用程式是一種設計用來在電腦或其他電子設備上執行特定任務的程式。下面是一個簡單的軟體應用程式運作方式的概述，針對非工程師的讀者：
程式碼撰寫： 軟體應用程式通常由一組指令或程式碼組成，用來指示電腦執行特定的任務。這些程式碼可以用不同的程式語言（如Python、Java、C++等）來撰寫。
**編譯**或解釋： 程式碼需要透過**編譯器**或解譯器轉換成電腦能夠理解和執行的機器語言。編譯器將程式碼轉換成**二進位機器碼**，而解譯器則逐行解釋並執行程式碼。
- 程式碼 -> 編譯器 -> 二進位機器碼
- 環境＋二進位機器碼 -> 才可以跑起來
- Xcode (IDE) 環境＋編譯器＋一堆好用小工具
執行： 經過編譯或解釋後，程式碼開始在電腦上執行。這可能涉及到處理資料、與使用者進行互動、進行計算等操作，以完成程式的功能。
輸入與輸出： 軟體應用程式通常接收來自使用者或其他系統的輸入，並根據這些輸入產生相應的輸出。這可以是文字、圖形、音訊或其他形式的資訊。
- (客戶) 發需求給 PM
- UI/UX
- Front-End
- Back-End
- Data Engineer
- Data Scientist
- Database Administrator (DBA)
存儲與處理資料： 程式通常需要在執行過程中存取和處理資料。這可能包括讀取和寫入檔案、與**資料庫**進行交互、或在**記憶體**中處理**暫存資料**等操作。
- CPU (16 core intel / M1)
- Memory (16GB) 是整台電腦用的，黏在主機板上
- Video Card (Nvidia GTX 1800)
- Memory (4GB) 是顯示卡專用的，黏在顯示卡上
- Disk (500Gi)
- GB GigaByte (10^9) MB Megabyte (10^6) kb kilobyte (10^3)
- Gb Gigabit Mb Megabit
- Gi 10^9
- 1 byte = 8 bit
- [0] = 0
- [1] = 1
- [0][0] = 0
- [0][1] = 1
- [1][0] = 2
- [1][1] = 3
- 00
- 01
- 10
- 十進位
- 1 1 = 1 * 10 + 1
- 1 1 1 = 1 * 10^2 + 1 * 10 + 1
- 二進位
- 001 + 1 = 00000010 = 2
- 010 + 1 = 00000011 = 3 = 1 * 2 + 1
- 011 + 1 = 00000100 = 4 = 1 * 2^2 + 0 * 2^1 + 0 * 2^0
- 100 + 1 = 00000101 = 5 = 1 * 2^2 + 0 * 2^1 + 1 * 2^0
- 101 + 1 = 00000110 = 6 = 1 * 2^2 + 1 * 2^1 + 0 * 2^0
- 110 + 1 = 00000111 = 7 = 1 * 2^2 + 1 * 2^1 + 1 * 2^0
- 111 + 1 = 00001000
- ...
- 1010+ 1 = 00001011 = 11 = 1 * 2^3 + 0 * 2^1 + 1 * 2^1 + 1 * 2^0
- 11111110 +1 = 11111111 = 1 * 2^7 + 1 * 2^6 + 1 * 2^5 + 1 * 2^4 + 1 * 2^3 + 1 * 2^2 + 1 * 2^1 + 1 * 2^0
- 11111111 + 1 = 100000000 = 256
**錯誤處理**： 當程式遇到錯誤或異常情況時，它可能會採取相應的措施，例如顯示錯誤訊息、記錄錯誤資訊、或者嘗試恢復執行狀態。
總的來說，軟體應用程式是一個由程式碼組成的系統，它接受輸入、進行處理、產生輸出，並且在執行過程中可能與使用者互動或與其他系統進行通訊。
(2024/03/20)
### 2. HTML, CSS, JavaScript 是如何變出一個網站的
HTML、CSS 和 JavaScript 是建構網站的三個主要技術。以下是它們如何協同工作來建立一個網站的概述：
HTML（超文字標記語言）： HTML 是一種標記語言，用於定義網頁的結構和內容。它使用各種標籤（如 <html>、<head>、<body>、< div>、< p> 等）來標示不同的元素，例如段落、標題、圖像、連結等。**HTML 主要負責描述網頁的結構和內容**。
CSS（層疊樣式表）： CSS 是一種樣式表語言，用於控制網頁的外觀和風格。通過選擇器和屬性，CSS 可以**定義元素的外觀**，例如顏色、字型、大小、間距、邊框等。使用 CSS 可以使網站呈現出統一、美觀的外觀，同時提供更好的用戶體驗。
JavaScript： JavaScript 是一種**動態程式語言**，用於實現網頁的互動性和動態效果。它可以與 HTML 和 CSS 配合使用，通過事件處理器（如點擊、滑鼠移動、鍵盤輸入等）來觸發特定的操作或改變網頁的內容和外觀。JavaScript 也可以用於與伺服器進行通訊，從而實現更複雜的功能，如資料處理、表單驗證、動態載入內容等。
網站的建立過程通常包括以下步驟：
設計網站結構： 使用 HTML 標籤定義網頁的結構和內容，包括標題、段落、圖像、連結等。
設計網站樣式： 使用 CSS 樣式來為網頁添加外觀和風格，包括顏色、字型、佈局等。
添加互動功能： 使用 JavaScript 編寫互動性功能，例如表單驗證、動畫效果、頁面轉換等。
測試和優化： 測試網站的功能和兼容性，並根據需要進行優化和調整。
經過這些步驟，你就可以建立一個完整的網站，利用 HTML 定義結構、CSS 添加樣式、JavaScript 實現互動性，使之成為一個吸引人的網路資源。
### 3. 伺服器是什麼，在哪裡
**伺服器**是一種專門用於提供服務、資源或功能給其他設備或軟體的電腦系統。簡單來說，它是一台具有**特定功能的電腦**，通常會提供以下幾種主要功能：
儲存資料： 伺服器通常會儲存資料庫、檔案、程式碼等數據，供其他用戶或程式存取和使用。
提供服務： 伺服器可以運行各種軟體服務，如**網頁伺服器**、**電子郵件伺服器**、**資料庫伺服器**、應用程式伺服器等，以便提供相應的服務或功能。
處理請求： 伺服器可以接受來自用戶或其他系統的請求，並根據這些請求執行相應的操作或提供所需的資訊。
通訊和傳輸： 伺服器可以在不同的設備之間進行通訊和資料傳輸，如**網路伺服器**、**檔案伺服器**等。
伺服器通常位於數據中心或**資料中心**中，這些地方提供了良好的物理安全性、穩定的電力供應、高速的網路連接等基礎設施，以確保伺服器能夠正常運行。另外，許多公司也會在內部架設伺服器，用於內部系統、應用程式等用途。
除了物理位置外，伺服器也可以虛擬化運行在**雲端平台**上，這意味著它們實際上可能是運行在遠端數據中心的虛擬機器上，通過互聯網提供服務。這種模式稱為雲端運算，使得用戶可以按需使用伺服器資源，而不需要自己擁有或管理實體伺服器。
### 4. 雲端和地端有什麼差別
**雲端運算**（Cloud Computing）和**地端**（On-premises）是兩種不同的資訊技術部署模式，它們之間有幾個主要的差異：
位置：
雲端運算： 資源（如伺服器、儲存空間、資料庫等）是通過互聯網提供的，並由雲端服務提供商（如Amazon Web Services、Microsoft Azure、Google Cloud等）在其數據中心中運行和管理。
地端： 資源是部署在組織或企業的內部網絡中，通常位於公司的數據中心或本地服務器上。
擁有和管理：
雲端運算： 雲端服務提供商負責資源的管理、維護和更新，用戶通過訂閱模式或按使用量支付費用。
地端： 組織或企業自己負責資源的擁有和管理，包括硬體購買、設置、配置、更新和維護，需要相應的IT人員和設施。
彈性和擴展性：
雲端運算： 提供了彈性和擴展性，用戶可以根據需要動態調整資源，並快速擴展或縮小規模。
地端： 要擴展資源通常需要額外的硬體購買和配置，時間和成本較高，且難以快速調整。
安全性：
雲端運算： 提供商通常會實施各種安全措施來保護資源和數據，但用戶需要確保其使用適當的安全控制和最佳實踐來保護其內部數據。
地端： 由組織或企業直接控制，可以根據自身需求和政策實施相應的安全措施。
總的來說，雲端運算提供了更靈活、更具彈性和擴展性的解決方案，而地端則提供了更多的直接控制和可定制性，但需要更多的管理和成本。選擇使用雲端還是地端取決於組織的需求、預算、安全性要求和對管理的偏好。
### 5. 資料庫會儲存哪些資料
資料庫是一個組織化的資料集合，用於儲存和管理各種類型的資料。它可以儲存各種形式的資料，包括但不限於：
用戶資訊： 這包括用戶的姓名、地址、電子郵件地址、電話號碼等個人資訊。
金融資訊： 金融機構的交易記錄、帳戶餘額、信用卡交易紀錄等金融資訊可以被儲存在資料庫中。
產品資訊： 商品和服務的相關資訊，例如商品名稱、描述、庫存量、價格等。
訂單和交易記錄： 這包括顧客的訂單信息、交易日期、金額、付款方式等。
日誌和活動追蹤： 應用程式或系統的日誌記錄、使用者活動追蹤、錯誤日誌等。
多媒體檔案： 包括圖像、音訊、影片等多媒體檔案，例如用戶上傳的頭像、產品圖片、廣告視頻等。
網站內容： 網站的內容、頁面結構、文章、部落格帖子、評論等。
日程和行事曆： 日曆應用程式的行事曆事件、提醒、約會等。
感測器數據： 來自各種感測器（如溫度、濕度、壓力感測器等）的數據。
文檔和報告： 各種文檔、報告、表格等。
總的來說，資料庫可以儲存幾乎所有類型的結構化和非結構化資料，它的主要目的是提供一個有效率、安全地儲存和管理資料的方式，以便後續的查詢、分析和應用。
(2024/03/21)
### 6. 網路是怎麼傳遞資料的
網路通常是通過數據包（Data Packets）的形式來傳遞資料的。這裡是網路傳遞資料的一個簡單概述：
數據分割： 當一個設備（比如你的電腦）想要發送資料到另一個設備（比如一個網站伺服器），它會將資料分割成較小的單位，稱為數據包。
加上標頭資訊： 每個數據包都會包含一些標頭資訊，這些資訊描述了數據包的來源、目的地、優先級、數據包順序等。
路由選擇： 當數據包準備好發送時，網路裝置（如路由器）會根據目的地的地址以及網路狀態來決定最佳的路由途徑。這通常涉及到多個路由器和網路節點之間的通信。
數據包傳輸： 一旦決定了路由途徑，數據包就會透過這個路由途徑傳送。數據包在傳輸過程中可能會經歷多個網路節點，包括路由器、交換機等。
數據包重新組裝： 一旦數據包到達了目的地，它們會被重新組裝成完整的資料，這些資料可以被接收設備（如伺服器）識別和處理。
整個過程通常是在毫秒級別完成的，這使得資料能夠以極高的速度在網路上傳輸。這也是因為TCP/IP協議是一個分層的協議，它把整個網路通訊過程分成了不同的層級，每一層都有自己的功能。
[網路 Layer 7 模型](https://www.ithome.com.tw/tech/47085)
[圖片支援](https://insights.profitap.com/hs-fs/hubfs/The%207%20Layers%20of%20OSI.png?width=1120&name=The%207%20Layers%20of%20OSI.png)
### 7. 什麼是 API，為什麼要有
example:
- https://www.mediawiki.org/wiki/API:REST_API/Reference
- https://en.wikipedia.org/w/rest.php/v1/search/page?q=diana&limit=5
```
curl "https://en.wikipedia.org/w/rest.php/v1/search/page?q=diana&limit=5"
```
**API (Application Programming Interface)** 是一組定義了不同軟體系統之間互動的規則、協定和工具的介面。簡單來說，API 可以被看作是軟體系統之間溝通的一種方式，它定義了一組允許不同系統或應用程式之間進行交流和資料交換的規則和方法。
API 通常提供了一系列的函式、類別、方法或端點，允許其他程式透過呼叫這些函式或使用這些端點來訪問特定的功能或資源。例如，社交媒體網站的 API 可能提供了用於讀取、發佈或刪除用戶帖子的端點，而支付系統的 API 可能提供了用於處理交易的函式。
為什麼需要 API？
促進整合和互操作性： API 允許不同系統之間進行溝通和資料交換，從而促進了系統之間的整合和互操作性。這使得不同的應用程式可以彼此連接和協作，從而創造出更強大和功能豐富的解決方案。
提供**程式化的訪問**： API 提供了一個程式化的介面，允許開發人員通過程式碼來訪問特定的功能或資源，從而使得應用程式開發更加靈活和高效。
促進創新和發展： API 可以讓開發人員利用現有的資源和功能來創建新的應用程式或服務，從而促進了創新和發展。
降低開發成本： 通過利用現有的 API，開發人員可以節省大量的時間和資源，從而降低了開發成本和風險。
總的來說，API 是現代軟體開發中不可或缺的一部分，它為不同系統之間的整合和互動提供了一個標準和方便的方式，同時促進了創新和發展。
(03/23)
## 工程師的工作日常
### 1. 寫程式是什麼
寫程式是指使用特定的**程式語言**，按照一定的邏輯和規則，將想法或需求轉換為電腦可以理解和執行的**指令集合**。這些指令告訴電腦在特定情況下應該執行哪些操作，從而實現特定的功能或解決特定的問題。
寫程式的過程通常包括以下步驟：
問題分析： 首先，需要明確了解要解決的問題或實現的功能是什麼，並將其轉化為可以由電腦執行的任務。
設計： 根據問題的需求，設計程式的結構、邏輯和流程。這包括選擇適合的資料結構和演算法，設計程式的模組和功能，以及確定程式的流程和控制結構。
編碼： 使用選定的**程式語言**將設計轉化為具體的程式碼。這涉及到撰寫和編輯程式碼文件，並根據設計準則和最佳實踐編寫代碼。
測試： 測試程式的各個部分，確保它們按照預期運行並產生正確的結果。這包括單元測試、集成測試和端對端測試等。
調試和優化： 當發現問題或錯誤時，進行調試並修復問題。同時，優化程式的性能和效率，使其更快速、更穩定和更有效。
部署和維護： 將完成的程式部署到**目標環境**中，使其可以被使用者使用。同時，定期進行**維護和更新**，以確保程式的正常運行和安全性。
總的來說，寫程式是一個創造性和具有挑戰性的過程，它涉及將抽象的想法轉化為具體的實現，並通過試驗和迭代來完善和改進程式。
### 2. 網站壞了，為什麼
網站出現問題可能有多種原因，以下是一些常見的原因：
伺服器問題： 伺服器可能出現故障或過載，導致網站無法正常運行。這可能是由於硬件故障、軟體錯誤、網路問題或太多流量等原因引起的。
程式碼錯誤： 網站的程式碼中可能存在**錯誤或漏洞**，導致網站無法正常加載或執行。這可能包括 JavaScript 錯誤、服務器端錯誤、資料庫錯誤等。
資料庫問題： 如果網站使用了資料庫來存儲資料，資料庫可能出現問題，例如連接失敗、資料庫服務器故障、資料庫崩潰等。
網路問題： 網站可能受到**網路問題**的影響，例如網路連接不穩定、DNS 解析問題、防火牆阻止訪問等。
安全問題： 網站可能受到**安全漏洞或攻擊**的影響，例如跨站腳本（XSS）、SQL 注入、DDoS 攻擊等。
更新或維護： 網站可能因為正在進行**更新或維護**而暫時關閉或無法訪問。
如果網站出現問題，可以嘗試重新加載網頁、清除瀏覽器快取、檢查網路連接，或者聯繫網站管理員以獲取更多幫助。
### 3. 使用開發者工具來除蟲 – Debug, DevTools
使用開發者工具來**除蟲**（Debug）是開發網站或應用程式時的常見做法。以下是使用開發者工具進行除蟲的一般步驟：
打開開發者工具： 在大多數瀏覽器中，可以通過按下 F12 鍵或右鍵點擊網頁並選擇「檢查」來打開開發者工具。或者，您可以通過瀏覽器菜單來找到開發者工具選項。
檢查 Console（控制台）： Console 頁籤用於顯示網頁上的錯誤訊息、警告和日誌。如果網站出現問題，首先檢查控制台中是否有任何錯誤訊息。
檢查網絡（Network）： Network 頁籤顯示網站請求的詳細信息，包括請求的URL、狀態碼、響應時間等。如果某些資源無法加載或請求失敗，您可以在這裡找到相關的信息。
檢查元素（Elements）： Elements 頁籤顯示網頁的HTML結構和CSS樣式。您可以使用這個頁籤來檢查元素的屬性、樣式、佈局等，並進行即時的修改和測試。
使用斷點（Breakpoints）： 在 Sources（來源）頁籤中，您可以設置斷點來暫停 JavaScript 的執行，以便檢查代碼的狀態和變量。在程式碼中單擊行號，可以添加或移除斷點。
使用Console來測試代碼： 在 Console 頁籤中，您可以直接輸入和執行 JavaScript 代碼，用於測試函式、查詢DOM元素、訪問變量等。
優化性能： Performance（性能）頁籤可以用來分析網站的性能問題，包括加載時間、事件處理、渲染性能等。
其他工具： 開發者工具還提供了其他一些有用的功能，如測量工具、記憶體工具、應用程式面板等，這些工具可以幫助您更好地了解和優化網站的性能和行為。
總的來說，開發者工具是開發網站和應用程式的重要工具，它可以幫助開發人員找到並解決各種問題，從而提高開發效率和品質。
### 4. 網站上線前先測試一下吧 – Test
工程師在網站上線前進行測試是非常重要的工作步驟。以下是工程師在網站上線前測試的一些日常工作：
功能測試： 確保網站的各項功能能夠正常運作，包括表單提交、頁面導航、資料處理、用戶登錄等。這涉及到模擬不同的使用情境，例如不同的設備、瀏覽器或網速，以確保在各種情況下都能正常工作。
兼容性測試： 確保網站在不同的瀏覽器（如Chrome、Firefox、Safari、Edge等）和設備（桌面、平板、手機）上都能正常顯示和運作。這可能需要使用不同的測試工具或服務來進行測試。
性能測試： 測試網站的加載速度、響應時間和效能，以確保網站在高流量情況下仍能保持良好的性能。這可能包括使用性能測試工具、監測服務器資源使用情況等。
安全性測試： 測試網站的安全性，包括對應用程式進行**安全漏洞**測試、對敏感信息進行適當的加密和保護，以及確保符合相關的安全標準和法規要求。
可用性測試： 測試網站的**可用性和易用性**，確保用戶能夠輕鬆找到他們需要的資訊，並順利完成操作。這可能包括使用測試工具、進行用戶測試等。
**回歸測試**： 在進行任何更改或更新後，進行回歸測試以確保新的功能不會破壞現有的功能，並且整個網站仍能正常運作。
文件撰寫： 撰寫測試計劃、測試用例和測試報告，記錄測試結果和問題，並跟蹤問題的修復進度。
總的來說，工程師在網站上線前進行測試是為了確保網站的質量、安全性、性能和可用性，從而提供給用戶一個穩定、安全和良好的使用體驗。
### 5. 工程師是怎麼用電腦工作的 – CPU, Memory, Terminal
工程師通常使用電腦進行工作，並與各種硬體和軟體組件互動。以下是工程師如何使用電腦的一般工作流程，以及與 CPU、記憶體和終端機（Terminal）的關係：
**CPU（中央處理器）**： CPU 是電腦的核心組件之一，負責執行各種計算任務和處理器指令。當工程師使用電腦時，CPU 負責執行軟體應用程式，包括編譯程式碼、運行測試、處理數據、以及執行其他計算任務。
**記憶體（RAM）**： 記憶體是用於暫時儲存資料和程式碼的地方，當電腦運行應用程式時，這些程式和數據會被加載到記憶體中以供 CPU 訪問。工程師使用記憶體來存儲和操作大型程式、數據集和文件，以確保良好的性能和效率。
**終端機（Terminal）**： 終端機是工程師在電腦上與操作系統和應用程式進行交互的主要方式。通過終端機，工程師可以使用**命令列界面**（CLI）來執行各種操作，如運行程式、管理文件、設置系統參數等。終端機也是工程師進行軟體開發和調試的重要工具，例如編譯程式碼、執行測試、查看日誌、訪問遠端伺服器等。
在工程師的日常工作中，他們通常會同時使用 CPU、記憶體和終端機來執行各種任務和操作。例如，當他們進行軟體開發時，他們可能會使用終端機來執行編譯器或**集成開發環境**（IDE）來編寫、測試和調試程式碼；同時，CPU 和記憶體負責執行這些程式碼並處理相關的數據和任務。
### 6. 工程師們是怎麼一起工作的 – Git
工程師在日常工作中通常需要與團隊成員協作，以完成各種軟體開發任務。Git 是一個非常流行的**版本控制系統**，它提供了一套強大的工具，使得工程師可以有效地協作並管理程式碼。以下是工程師們如何使用 Git 來協作的一般流程：
建立項目儲存庫（**Repository**）： 團隊中的一個成員通常會建立一個 Git 儲存庫，用於存儲和管理項目的程式碼。這個儲存庫可以在本地電腦上建立，也可以在遠端伺服器上建立，如**GitHub**、GitLab或Bitbucket等。
克隆儲存庫（**Clone Repository**）： 團隊中的其他成員可以從遠端儲存庫克隆（Clone）一份程式碼到自己的本地電腦上，這樣他們就可以在本地進行開發工作。
分支（Branching）： 每個工程師在開發新功能或修復問題時通常會創建一個新的**分支（Branch）**。這樣可以在不影響主要程式碼的情況下進行工作，並且可以輕鬆地合併（Merge）到主分支中。
**提交（Commit）**： 工程師在修改程式碼後，會將這些修改提交到本地儲存庫中。每個提交都可以包含一個或多個變更，並且應該有一個相關的訊息來描述這些變更。
**推送（Push）**： 一旦工程師對程式碼進行了一系列的提交，他們就可以將這些變更推送到遠端儲存庫中，以供其他團隊成員查看和合併。
**合併（Merge）**： 當一個功能完成並且經過測試後，工程師可以將其分支合併回主分支中。這將使新功能成為主要程式碼的一部分，並且可以被其他人使用。
**解決衝突（Resolve Conflicts）**： 在合併分支時，可能會發生衝突，即同一行程式碼在不同分支中有不同的修改。在這種情況下，工程師需要解決這些衝突，以確保程式碼的完整性和一致性。
持續整合（Continuous Integration）： 團隊通常會使用持續整合工具，如Jenkins或Travis CI等，來自動化測試和部署程式碼的過程，以確保程式碼的質量和穩定性。
總的來說，Git 提供了一個強大而靈活的工具，使得工程師可以有效地協作、追蹤程式碼變更並管理項目的開發進度。
### 7. 敏捷開發與瀑布開發
敏捷開發和瀑布開發是兩種常見的軟體開發方法論，它們在團隊組織、流程和產出方面有著不同的特點。以下是對兩種開發方法論的簡要說明：
### 瀑布開發（Waterfall Development）：
順序式流程： 瀑布開發是一種**順序式**的開發模型，軟體開發流程被劃分為一系列線性階段，包括需求分析、設計、開發、測試和部署。
固定計劃： 在瀑布開發中，整個開發過程的計劃在一開始就被確定下來，每個階段的完成都是獨立的，並且必須在進入下一階段之前完成。
較高的風險： 瀑布開發的風險較高，因為在開發過程的後期才會進行測試和驗證，而一旦發現問題，往往需要花費較大的代價和時間進行修復。
適用於固定需求： 瀑布開發適用於對需求較為確定且不太可能變更的項目，例如傳統的企業應用程式開發。
### 敏捷開發（Agile Development）：
迭代式與增量式： 敏捷開發是一種**迭代和增量式**的開發模型，軟體開發被劃分為多個短周期的迭代，每個迭代都會產生一個可以使用的軟體版本。
靈活適應變化： 敏捷開發著重於靈活地應對變化，強調持續反饋和調整，團隊可以在開發過程中根據用戶反饋和需求變化來調整產品方向。
較低的風險： 敏捷開發在**每個迭代中都進行測試和驗證**，因此可以及早發現和解決問題，從而降低了開發過程的風險。
適用於變化需求： 敏捷開發適用於對需求不太確定或可能會經常變更的項目，例如Web應用程式開發、新產品開發等。
總的來說，瀑布開發著重於嚴格的**計劃和順序**式的開發流程，適用於較為穩定的需求和較為傳統的專案；而敏捷開發則強調**靈活性和持續改進**，適用於需求變化頻繁的項目和快速上線的產品。
# 案例分析與分組練習
RAGIC!
### 1. 改這個功能會不會很難
### 2. 一些要注意的資訊安全
### 3. 軟體開發、迭代流程
### 4. 實務功能分析
# (3/23) Day 105: Swift Apple Tutorial 1: about me
https://developer.apple.com/tutorials/sample-apps/aboutme
查到從哪裡進去的！！！！
https://developer.apple.com/xcode/resources/
learning route:
1. Exploring SwiftUI Sample Apps
2. Introducing SwiftUI
3. Exploring SwiftUI Sample Apps
學習目標
1. 在 xcode 打完這份 code，在 iphone 上跑起來
1. 手到：打字練習會增加手感跟肌肉記憶
1. 問題處理：
1. 遇到問題時，先 google 查資料，學會用「英文關鍵字」查資料是超級重要的技能
1. 查詢 [Apple SwiftUI 官方文件關於 Text](https://developer.apple.com/documentation/swiftui/text)(google: "swift text")
1. 下載完整 project file，使用 Swift Playground 跑起來，然後比對自己 xcode 內容的差異
1. 用英文問 [chatGPT](https://chat.openai.com/)
1. 還是卡住，可以記下問題，找時間問人
1. 舉一反三：使用 project 示範的內容，試著增加更多自己想要的內容
1. 多加喜歡的 Text，Image
1. 增加 ScrollView
1. 增加 TabView 的 View
1. VStack + HStack 組合
1. ForEach，在 information 中增加一個新欄位，並使用 ForEach show 出內容
# Day 106: Swift Apple Tutorial 2: Choose Your Own Story
https://developer.apple.com/tutorials/sample-apps/chooseyourownstory
學習目標
1. iphone 跑起來
1. 學會使用幾個 xcode 的快捷鍵(google "xcode 常用快捷鍵")
1. 問題處理
1. 舉一反三
1. 增加 [Day 105 Tutorial 1: about me](https://hackmd.io/At6AkKCZTDuMPe-ciQdc6g?both#323-Day-105-Swift-Apple-Tutorial-1-about-me) 學到的頁面
# Day 201: 職缺與 Roadmap
https://www.cakeresume.com/jobs/Swift?seniority_level%5B0%5D=entry_level&seniority_level%5B1%5D=internship_level
技能 Must have
- Swift 六月，看書 / SwiftUI 七月，接 apple 內容
- push notification, notification cloud APIs, and cloud messaging
- RESTful API
- MVVM
- 作品，apple 比賽，證照
- Terminal，Git
- Unit Test
- CI/CD
- CocoaPods or Swift Package Manager
Good to Have
- App Store / Enterprise app上架經驗
- Bluetooth
# References 參考資料
- https://developer.apple.com/tutorials/swiftui/creating-and-combining-views
Sign in with Wallet
Connect another wallet