###### tags: `學期一` `學習教練快報`

# 學期 1：Week 3 學習教練快報

課程進入到最後一週啦，連續這幾週的密集學習，要保持這樣的動力真的非常不容易，尤其在忙碌的年末顯得更加困難！🙌

相較於上週，觀察到這週同學們在 Line 群組討論的比較少，鼓勵同學可以互相加油打氣，一起完成學期一的挑戰喔！提醒**還沒有完成進度的同學，記得把握週末的時間學習**，也推薦覺得自己想要專注或是需要讀書氛圍的同學可以**加入假日的[飛航學習室](https://calendar.google.com/calendar/u/0/embed?src=[e-mail]&ctz=Asia/Taipei)趕進度**～

<!-- 另外，`週日下午 14:00-17:00` 有飛航特殊場次，想要跟助教提問或是參與分組討論的同學不要錯過囉！詳細資訊放在頁面下方，有需要的同學記得報名參加！ -->

<!-- Sunny 教練注意到很多同學都沈浸在 PJ 老師的教學影片中持續保持學習，非常開心！也期待大家都能利用週末好好衝刺，一起通過學期 1 的考驗！ -->

<!-- 不過可能也因為這樣，目前還沒有看到同學參加這次[工作坊會後挑戰](https://lighthouse.alphacamp.co/courses/39/units/28521) 😅 教練這週就跟大家分享過去比較特別的作品，鼓勵同學們一起參加！ -->
#### 接下來你可以做的事

<ul>

<li><code>尚未完成本週進度的同學</code>：把握週末好好衝刺，繳交指標作業<a href="https://lighthouse.alphacamp.co/courses/39/assignments/929" target="_blank"> A17: 打造你的英雄頁面</a>，鼓勵同學盡快完成作業、把握機會提問哦！</li><br>

<li>
<code>已經完成本週進度的同學</code>：鼓勵你持續學習，去挑戰以下的額外練習，持續精進自己的程式能力：

<ul>
<li><a href="https://lighthouse.alphacamp.co/courses/39/assignments/932" target="_blank">期末考</a></li>
<li>將 <a href="https://lighthouse.alphacamp.co/courses/39/assignments/1212" target="_blank"> A16: 為客戶打造履歷網頁 </a>修改成自己的履歷</li>
<li>將 <a href="https://lighthouse.alphacamp.co/courses/39/assignments/929" target="_blank"> A17: 打造你的英雄頁面</a> 換成自己喜歡的卡通人物</li>
<li>將以上修改完成的履歷或英雄頁面分享在 Line 群組 👏</li>

</li>
</ul>

</li>

</ul>

鼓勵大家把握這幾週以來建立起的學習動能，充分利用所有練習機會、持續精進。
期待見到所有同學都能順利完成學期 1 ，成功建立網路開發的基礎！

<!-- 完成課程後，也別忘記花點時間去思考你[下一步的學習規劃](https://lighthouse.alphacamp.co/courses/39/units/28588)喔！ -->

<!-- 教練也想把有趣的作品 highlight 出來。 -->

<!-- #### 改良你的 hero page，做成你最喜歡的樣子！

此外，Sunny 也看到，在週三的工作坊後，已經有同學迅速完成前端基礎[工作坊的會後挑戰](https://lighthouse.alphacamp.co/courses/39/units/28521)，改良出自己的 hero page 了！歡迎大家一起來發揮創意，加入這個挑戰並和大家分享作品！ -->

<!-- #### 改良你的 hero page，做成你最喜歡的樣子吧！ -->

<!-- 此外，也有部分同學參與了前端基礎工作坊的會後挑戰，將自己的 hero page 進行改良，並分享出來。教練也想把一些有趣的作品 highlight 出來。 -->

<!-- 大家可能還在完成本週進度的路上，目前還沒有同學參加這次工作坊的會後挑戰 😅 教練這週就跟大家分享過去比較特別的作品，希望能鼓勵到同學們在完成進度後一起來參加！

以下分享過去學長姐的 [hero page](https://lighthouse.alphacamp.co/courses/39/units/28529) 作品，歡迎同學發揮創意、一起加入這次的挑戰： -->

<!-- <div style="width:100%; display: flex;">

<div style="width: 50%; text-align: center">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/22249/Untitled-video-Made-with-Clipcha.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/22249/Untitled-video-Made-with-Clipcha.gif">
</a>
<a href="https://codepen.io/LJBL/full/wvjKjxE" target="_blank">作品連結</a>

</div>

<div style="width: 50%; text-align: center">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/22250/Untitled-video-Made-with-Clipcha__1_.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/22250/Untitled-video-Made-with-Clipcha__1_.gif">
</a>
<a href="https://codepen.io/kellychi/pen/LYmprmr" target="_blank">作品連結</a>
<br>
</div>

</div> -->

<!-- <div style="width: 50%; text-align: center;">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/21659/ezgif.com-gif-maker__1_.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/21659/ezgif.com-gif-maker__1_.gif">
</a>
<a href="https://lighthouse.alphacamp.co/courses/39/units/28201?comment_id=185016" target="_blank" style="margin-top: 10px">Simon 的作品</a>
</div> -->

<!--
Kelly 同學發揮了創意，做了角色的專屬 hero page，同時也尋找了許多不同的 CSS 效果：放大效果、加入漸層背景、利用 hover 做出「讓游標在指到不同元素時」改變大小、顏色等，讓作品更加生動有趣。 -->

<!-- 同學們發揮了創意，各自做了專屬 hero page，同時也尋找了許多不同的 CSS 效果：包含放大、圓角效果、shine effect、利用 hover 做出「讓游標在指到不同元素時」改變背景顏色、文字顏色和粗體、改變樣式等，讓自己的 hero page 成為更加生動有趣的作品。 -->

<!-- 學長姐運用了許多不同的 CSS 效果：包含圖片搖晃效果、利用 hover 做出「讓游標在指到不同元素時」改變顏色、大小等等不同的變化，讓自己的 [hero page](https://lighthouse.alphacamp.co/courses/39/units/28529) 成為更加生動有趣的作品。 -->

<!-- 以上兩份只是教練暫時幫大家挑出來的作品，其他參與挑戰的作品也都相當出色，套用了許多不同的效果，鼓勵大家多去觀摩！ -->

<!-- 不過與往常一樣，我們鼓勵所有同學把握所有額外練習的機會，本週也想特別點出幾份 [工作坊會後挑戰](https://lighthouse.alphacamp.co/courses/39/units/7927#share_subjects) 的成果跟大家分享一下！ -->

<!-- 在週二的工作坊結束後，不少同學就自行去尋找了許多不同的 CSS 效果：更改字體、漸層顏色、字體陰影；也有同學妙用先前教過的圓角效果進行延伸，將自己的大頭貼改成樹葉的形狀；甚至有很多同學都找到了 hover 的屬性，讓游標在指到不同元素時會做出非常多樣的變化。 -->

<!-- 過往的挑戰中，同學們多半都是通過某個技術挑戰後就可以完成，但在 -->

<!-- 這次的挑戰中，我們沒有指定的「正確樣式」，就是希望同學<b><u>盡量去探索，在不斷觀摩、查找資料的過程中，越來越熟悉介面的操作</u></b>，也能從中獲得非常有趣的回饋。 -->

<!-- #### 共享學習心得

即便度過了三週的密集學習，大家現在也還是剛起步的狀態。因此教練也會不時分享出幾篇同學們的學習回顧，作為大家在調整學習心態和學習方法的參考。

如果你也有遇過**花了超長的時間在跟一個題目奮鬥，甚至到有點挫折的狀況**，可以參考 Penny Pan 同學在遇到類似狀況後的做法（[ORID 原文](https://lighthouse.alphacamp.co/courses/39/assignments/925/submissions/127059?choice_cohort=all_cohort&from=other-submission&question_id=2033)）：

- 更詳細記錄寫作業時的心得、觀摩和收到助教批改的學習
- 認真規畫學習時間，特別是在作業的地方要為自己設停損點，提醒自己參考別人的想法寫出總結會學到更多東西。

➡️ 如果你忘記或不知道停損點是什麼，請參考[這個單元](https://lighthouse.alphacamp.co/courses/38/units/7526) -->

<!-- #### ✨ **學習活動預告** ✨
#### 【飛航學習室 - 分組討論及助教 Live QA】
年底到了工作生活忙碌讓你來不及跟上進度嗎？
不要忘記你來 AC 學習的目標，給自己一個不能怠惰的理由，參加飛航學習室專心唸書吧！
特別在這個週末舉行了飛航特殊場次，將會有分組討論及助教到場解惑，一起在學習這條路上持續前進吧！

📣 日期時間 | 10/16(日) 14:00-17:00
📣 報名及事前提問單 | https://alpha-camp.typeform.com/to/ER74vJ7B
📣 飛航連結 | https://zoom.us/j/89700339048

<div style="display:flex;justify-content:space-evenly;">

<a class="btn-green" href="https://alpha-camp.typeform.com/to/ER74vJ7B" target="blank">點我報名活動 </a>

</div> -->

最後，在這裡預祝同學們聖誕快樂、新年快樂，以及學習順利，成功攻克學期 1！💪 💪 💪

<div style="width:100%"><img style="max-width:1000px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14930/banner.002.png"></div>

<!-- #### 【專案管理小學堂】
專案管理是什麼？能吃嗎？
現任 AC 助教 Freddy 擁有 PMP 專案管理課程經驗，即將在 9 月份的社群分享會中，分享專案管理的知識與生活工作的應用經驗，包括：

📣 專案管理的 10 大知識領域
📣 組織結構與 PM 領導風格
📣 Stakeholder 的甘苦談

註：本場次是專案管理課程內容的硬知識講授為主，輔以生活經驗分享，而不是 PM 工作開箱 喔！

* 日期時間：9/20 (二) 19:30-21:00
* 報名連結：https://reurl.cc/NRQ54p -->

<!--
<div style="display:flex;justify-content:space-evenly;">

<a class="btn-green" href="https://reurl.cc/NRQ54p" target="blank">點我報名活動 </a>

</div> -->

<!-- ##### 2️⃣【產業分享 -- 探索 Web3 & 區塊鏈的虛擬世界】

<div style="width: 100%; display: flex; justify-content: space-between; align-items: center;">
<div style="width: 40%;">
<img src="https://assets-lighthouse.alphacamp.co/uploads/image/file/20797/web3___blockchain_square_.png">
</div>
<div style="width: 55%;">

你也聽過 Web3、區塊鏈、加密貨幣...但始終搞不懂是怎麼運作的嗎？還是你想試試虛擬貨幣的水溫，卻害怕一不小心掉入陷阱呢？<br>
這次的社群活動邀請到專職加密或投資的 Ken 和大家分享：<br>
💡 基礎原理介紹 - 區塊鏈、加密貨幣、交易方式...<br>
💡 防詐要領 - 詐騙案例與遠離詐騙的方法<br>
💡 區塊鏈的應用 - 身為工程師你可以做什麼？<br>

* 活動日期 👉🏼 4/28 (四) 19:30-21:30<br>
* 手刀報名 👉🏼 [https://ac-bootcamp.typeform.com/to/oqSx35Fl](https://ac-bootcamp.typeform.com/to/oqSx35Fl)<br>
</p>
</div>
</div> -->

<!-- 時隔一年多，AC 即將再次舉辦社群實體聚會 🎉
這次的活動邀請到四位 AC 助教，分享身為一位數位工作者應該具備的成長思維和能力，同時也設計了交流環節來幫助大家認識彼此，希望能藉由多元的討論來激發出不同的學習火花 🔥

<div style="display: flex; height: 80%; justify-content: center;">
<img style="height:60%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/19919/AC_______.jpg">
</div>
迫不急待想參加了嗎？請看活動資訊：

* 活動時間：2/19 (六) 13:30-17:00
* 地點：三創育成中心 11 樓
* 票價：AC 社群票 300 元 `本次無販售線上直播票`
* 限額 50 名，1/22 (六) 12:00 準時開賣 👉🏼 [點我購票](https://www.accupass.com/event/2201200616411236075595)

-->
<!-- #### 【AC 社群相談室 -- 你好，請多多指教】
<div style="display: flex; height: 100%; justify-content: center;">
<img style="height:60%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/17537/No_date____.png">
</div>

活動時間：11/10（三）19:30 - 21:00
立即報名（下週一截止）：https://ac-bootcamp.typeform.com/to/lMjf9e3k

期待下週見到你！ -->

<!--
學期 1 的最後，學習教練鼓勵所有同學們都可以把握[額外練習機會](https://lighthouse.alphacamp.co/courses/39/units/7927#share_subjects)，改良一下自己的 hero page 分享出來，也可以多多去觀摩其他同學的作品，把你覺得最有趣、最特別的效果也加到自己的作品中吧！ -->

<style>
.btn-green{
border-radius: 4px;
padding: 0 20px;
font-size: 0.875rem;
line-height: 40px;
height: 40px;
display: inline-block;
vertical-align: middle;
text-align: center;
white-space: nowrap;
cursor: pointer;
border: #00BFA5 2px solid;
background: #fff;
color: #00BFA5;
line-height: 36px;
font-weight: bold;
}

</style>

----
outline

* 分享以前學長的優秀作品
* 分享一點點職涯資訊
* call-to-action

# 學期 1：Week 3 學習教練快報

<!-- 經過兩個連續假期，加上最後一週的份量比較多的情況，要保持學習非常不容易。即便如此，教練依舊看到很多同學們把握課程最後一週持續學習，甚至也有同學已經完成所有課程、通過學期 1，令教練非常感動！ -->

#### 聖誕節過完，也不要忘記完成這週的進度喔！

連續三週的密集學習，要保持這樣的動力真的非常不容易！教練注意到很多同學都沈浸在 PJ 老師的教學影片中持續保持學習，非常開心！也期待大家都能利用週末好好衝刺，一起通過學期一的考驗！

<!-- 此外，也有部分同學參與了前端基礎工作坊的會後挑戰，將自己的 hero page 進行改良，並分享出來。教練也想把一些有趣的作品 highlight 出來。 -->

不過可能也因為這樣，還沒有同學參加這次工作坊的會後挑戰 😅 教練這週就跟大家分享過去比較特別的作品，希望能鼓勵到同學們一起參加！

#### 改良你的 hero page，做成你最喜歡的樣子吧！

<!-- 因此教練想跟大家分享同學已經做出的作品和過去學長姐製作的精美 hero page，鼓勵有意參加的同學在觀摩這幾份作品後，也能發揮創意，做出很棒的 hero page！

以下是 8 月班兩位同學的作品，都採用了互動式的 CSS 效果，讓頁面看起來更加生動！ -->

<!-- <div style="width:100%; display: flex;">

<div style="width: 50%; text-align: center;">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/14761/Intro_w3_challenge_11_1.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14761/Intro_w3_challenge_11_1.gif">
</a>
<a href="https://lighthouse.alphacamp.co/courses/39/units/8168?comment_id=85299" target="_blank">EJ TSENG 的作品</a>
</div>

<div style="width: 50%; text-align: center;">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/14762/Intro_w3_challenge_11_2.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14762/Intro_w3_challenge_11_2.gif">
</a>
<a href="https://lighthouse.alphacamp.co/courses/39/units/8168?comment_id=85338" target="_blank">小俊 的作品</a>
</div>

</div>

<br> -->

以下分享兩份過去學長姐特別有趣的 hero page 作品

<div style="width:100%; display: flex;">

<div style="width: 50%; text-align: center">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/14944/Thanos.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14944/Thanos.gif">
</a>
<a href="https://codepen.io/James556674/pen/bGEBjXR?editors=1100" target="_blank">作品連結</a>

</div>

<div style="width: 50%; text-align: center">
<a href="https://assets-lighthouse.alphacamp.co/uploads/image/file/14761/Intro_w3_challenge_11_1.gif" target="_blank">
<img style="max-width:800px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14761/Intro_w3_challenge_11_1.gif">
</a>
<a href="https://codepen.io/ej_tseng/pen/vYKMVBB" target="_blank">作品連結</a>
<br>
</div>

</div>

兩位同學各自去尋找了許多不同的 CSS 效果：更改字體、利用 hover 做出「讓游標在指到不同元素時」改變位置、顏色、大小的變化，讓自己的 hero page 成為更加生動有趣的作品。

<!-- 不過與往常一樣，我們鼓勵所有同學把握所有額外練習的機會，本週也想特別點出幾份 [工作坊會後挑戰](https://lighthouse.alphacamp.co/courses/39/units/7927#share_subjects) 的成果跟大家分享一下！ -->

<!-- 在週二的工作坊結束後，不少同學就自行去尋找了許多不同的 CSS 效果：更改字體、漸層顏色、字體陰影；也有同學妙用先前教過的圓角效果進行延伸，將自己的大頭貼改成樹葉的形狀；甚至有很多同學都找到了 hover 的屬性，讓游標在指到不同元素時會做出非常多樣的變化。 -->

<!-- 過往的挑戰中，同學們多半都是通過某個技術挑戰後就可以完成，但在這次的挑戰中，我們沒有指定的「正確樣式」，就是希望同學<b><u>盡量去探索，在不斷觀摩、查找資料的過程中，越來越熟悉介面的操作</u></b>，也能從中獲得非常有趣的回饋。 -->

<!-- #### 前端工程師 v.s. 後端工程師

雖然還在學期一，但教練已經陸陸續續收到一些同學在詢問：「我應該選前端還是後端？」因此教練也想趁著學期一結束之前，補充一點點前後端工程師的相關資訊，讓同學作為思考自己未來職涯的參考資料。

<div>
<table style="font-size: 13px;margin: 0 auto; width:100%">
<thead>
<tr>
<td style="background-color: #666666; padding: 12px; color: white; font-weight: bold; border-style: solid; border-width:1px; border-color: black; width: 10%;"></td>
<td style="background-color: #666666; padding: 12px; color: white; font-weight: bold; border-style: solid; border-width:1px; border-color: black; width: 45%;">前端工程師
</td>
<td style="background-color: #666666; padding: 12px; color: white; font-weight: bold; border-style: solid; border-width:1px; border-color: black; width: 45%;">後端工程師
</td>
</tr>
</thead>
<tbody>
<tr>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">能力
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">重視細節 - 連一個 pixel 的差異也不能放過
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">
<ul>
<li>邏輯思考能力強</li>
<li>有設計和操作資料庫的能力</li>
</ul>
</td>
</tr>
<tr>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">技能
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">
<ul>
<li>熟悉 CSS 框架，例如 Bootstrap</li>
<li>能夠善用 JavaScript 框架，建議 Angular.js、React.js 以及 Vue.js 三者至少會用一個</li>
<li>能活用響應式網頁，做出在跨平台、跨裝置都能完善呈現的網頁</li>
<li>串接來自後端的 API</li>
<li>前端資訊安全</li>
</ul>
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">
<ul>
<li>了解 HTTP、TCP 等網路通訊協定</li>
<li>至少精通一個後端語言，例如：Ruby、Python、PHP、Java、JavaScript</li>
<li>至少精通一項後端開發框架，例如：Rails、Django、Node.js 等</li>
<li>撰寫 Web API</li>
<li>專門來處理資料的 SQL</li>
<li>撰寫測試，並把測試自動化</li>
</ul>
</td>
</tr>
<tr>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">工具
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">
<ul>
<li>熟悉版本控制操作（例如：Git），能夠和多人協作專案</li>
<li>程式碼編輯器（例如：Sublime Text、Atom）</li>
<li>Chrome Developer Tools</li>
<li>CSS 預處理器（例如：Sass、Less）</li>
</ul>
</td>
<td style="background-color: #f3f3f3;padding: 12px; border-style: solid; border-width:1px">
<ul>
<li>熟悉版本控制操作（例如：Git），能夠和多人協作專案</li>
<li>程式碼編輯器（例如：Visual Studio Code, Sublime Text）</li>
<li>部署網站、資料庫的平台（例如：Heroku、AWS、Google Cloud Platform）</li>
<li>資料庫開發工具（例如：MySQL、PostgreSQL、SQL Server）</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div> -->

#### 接下來你可以做的事

<ul>

<li>
<code>已經完成本週進度的同學</code>：鼓勵你持續學習，去挑戰以下的額外練習，持續精進自己的程式能力：

<ul>
<li><a href="https://lighthouse.alphacamp.co/courses/39/assignments/932" target="_blank">期末考</a></li>
<li><a href="https://lighthouse.alphacamp.co/courses/39/units/8279" target="_blank">工作坊會後挑戰</a></li>
</ul>

</li>

<li><code>尚未完成本週進度的同學</code>：把握週末好好衝刺，繳交作業<a href="https://lighthouse.alphacamp.co/courses/39/assignments/929" target="_blank">A16: 打造你的英雄頁面</a>。行有餘力再來參與會後挑戰！</li>

</ul>

鼓勵大家把握這幾週以來建立起的學習動能，充分利用所有練習機會、持續精進。

期待見到所有同學都能順利完成學期一，成功建立網路開發的基礎！

<!--
學期 1 的最後，學習教練鼓勵所有同學們都可以把握[額外練習機會](https://lighthouse.alphacamp.co/courses/39/units/7927#share_subjects)，改良一下自己的 hero page 分享出來，也可以多多去觀摩其他同學的作品，把你覺得最有趣、最特別的效果也加到自己的作品中吧！ -->

<div style="width:100%"><img style="max-width:1000px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/14930/banner.002.png"></div>

<div style="width:100%"><img style="max-width:1000px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/21381/banner.001.png"></div>
------