# [LOG]_Side-Project

 [](/wo8sk25aQUqPwGId58DCXA?edit)


---

[TOC]

---

## Round-AM

### [10:30]_Start

- Why
- Career
- 了解框架、模組、語言
- 總是有很多 idea ~~-> 幻想能成為 richman~~
- 自動化很方便 ~~（我就懶）~~
- 不想被上班使用的語言框住，讓自己可以不斷學習

---

### [10:40]_分享-May

- 目標：找工作

- `React`
- 縮網址的專案

- 遇到困難
- `Google`

- 參考資料
- `frontendmentor`

>
> - https://www.frontendmentor.io
>

---

### [10:49]_找靈感

---

### Free-AM

#### [11:00-13:00]

---

## Round-PM

### [13:00]_Lightning-talk

#### Victor

- `Spotify`- 自動切換歌曲
- `token`
- copy sample code

---

#### Ruby

- T2-1
- 類似 `TODO-list`
- 新增、刪除

- 排版苦手

---

#### Mike

- T2-3
- review

- 練習象棋排版

> - 感覺圍棋比較容易

---

#### Chris

- T2-1

- Personal Portfolio
- React
- first landing pages

---

#### armo

- 畢業仔

- 網頁遊戲
- 足球
- first 先構圖

- 命名苦手
- 想從設計方面開始下手

---

#### B0

- T3

- 還在找遊戲的靈感
- connect14
- Youtuber

- 這禮拜練習 memory game
- 覺得邏輯比較弱
- 喜歡排版

---

### Charles

- 先有想法
- 購物車

---

### Angela

- T2-3

- 蒐集資料
- 覺得溫度計很有趣
- 想要做小東西
- 還在思考

---

### Connor

- T2-1

- 還沒想到
- 可能先靜態排版

---

### Neil

- T1

- 主要想練習排版的部分

- `Wix`
- 有很多模組
- 雖然是本科系出身的
- 之前工作室接案的攝影助理
- 也有網頁設計
- 所以找相關的範例
- 想找複雜一點的 `JavaScript`

> - https://themeforest.net

---

### Free-PM

#### [13:30-17:00]

---

## Round-Finale

### [17:00]_Share

- 踏出小步就可以了
- 從滑板車開始先能使用

#### Victor

- playlist
- group

- `Spotify`-`API`
- 換歌很像被別人卡掉
- 網路不好就沒辦法換歌
- 下次想換成 `mp3`

- 以及未來的計劃

---

#### Chris

- 先放在 `GitHub`
- 後來解決了

>
> - `Bikeshedding`
>

#### Ako

- 也常常會把事情放在小地方

- 圓角跟陰影會做
- 但卡在 `padding`、`margin`
- https://codepen.io/yuh0206/pen/LYOJegM

- 今日也是有發現小收穫

> https://codepen.io/yuh0206/pen/LYOJegM 問題：如何消除h3和p之間多餘的空白~還有如何讓最底下的文字(challenge~)的部分跟中間的圖片呈垂直狀態~ 原本的project連結：https://www.frontendmentor.io/challenges/qr-code-component-iux_sIO_H

#### Ruby

- 推到 Github pages

---

#### armo

- 畫面先排出來
- 想要有 `RWD`
- 但先延後

- 先往 `JavaScript` 的方向走

#### Naomi

- `Bootstrap`
- 黑暗料理展示

---

#### Cornor

- 大富翁網頁版
- 先排版

---

#### Ara

- 剛好要做畢業作品
- 打工換宿的平台

- 目前先畫框線稿

#### Rachel

- 網路不太好QQ
- 會後再貼去 Slack

#### May

- 幫之前的專案加入臉書登入的功能

- 找了套件不太實用
- 要重新整理才會出現
- 而且無法登出
- https://www.npmjs.com/package/react-facebook-login
- 3 年沒有維護的不太適合使用惹

- 後來找官方的文件

> - 同學：firebase

---

#### Neil

- 用自己拍的作品放到網頁上
- ~~FULL FULL FULL Stack Engineer~~

---

### Mike

- 先做了一半
- 用網格系統

- 卡在想把真正的線條印上去
- 順便練習排版

---
---

## Notes

### AM

>
> - [#Free-AM](#Free-AM)
>

- [x] 整理筆記與資源
- [ ] 構思要做什麼

---

#### AC

- 統整同學們的分享
- https://hackmd.io/@ac-let-s-study-together/S1ZeUSIxc

- 很強的同學
- https://tzynwang.github.io/archives/
- https://codepen.io/Kate-Chu
- https://medium.com/@amber.fragments/2022-daily-coding-challenge-35f753e9ea2c

- 可參考的資源
- https://backendflow.tech/coding-side-project-ideas/
- https://www.frontendmentor.io

---

#### if-sad-send-cat

>
> - https://healeycodes.com/when-im-sad-my-computer-sends-me-a-cat
>

#### 工具類

- 及時推播訊息（試用期：30 日）
- https://pushover.net

- random-API
- https://randomuser.me/api/
- https://api.thecatapi.com/v1/images/search

- HackMD
- https://hackmd.io/@hackmd-api/developer-portal/https:%2F%2Fhackmd.io%2F@hackmd-api%2FrkoVeBXkq

### PM

>
> - [#Free-PM](#Free-PM)
>


- 為何不是從輪子開始？
- 因為要看目標是什麼

- 滑板車、汽車 ➜ 可以懶得走路
- 雖然沒有做出汽車
- 但滑板車也能提供類似的功能 ➜ 懶得走路

- 目標 ➜ 想解決哪些問題

---

#### 【想解決哪些問題】

- 看線上影片時，可以方便做筆記

#### 【目前有哪些類似的工具】

>
> Clarity notes 最簡潔快速的 YouTube 邊看影片邊寫筆記工具
> https://www.playpcesor.com/2021/11/clarity-notes-youtube.html
>

- 如何改造：能否讓這個工具支援別的影音平台？
- 結果找到了

>
> Beastnotes ▪ Take notes for online courses
> https://chrome.google.com/webstore/detail/beastnotes-%E2%96%AA-take-notes-f/ijdbgcbejbmcfcglmbahkfpadjbebgal
>

- 試用 `Beastnotes`
- 有符合自己的需求嗎？
- 大概有 8 成了
- 還有哪些可以改造的部分？

#### `Beastnotes`

- 可以改善的部分
- 免費仔只有 3 則可以用
- 而且即便訂閱了，也不知道新創公司何時會倒閉
- 筆記放在上面不夠保險
- 最後還是會把筆記備份出去

- 所以要做什麼？
- 【A】：複刻 `Beastnotes`
- 【B】：讓 `Beastnotes` 用起來更懶人

#### 【現階段可以做的事情】_B

- LV.1 ➜ 用腳本寫出【漂浮按鈕】
- 點下去會自動複製文字框裡面的筆記內容
- 讓使用者可以貼到愛用的筆記軟體裡面
- `Obsidian`, `Evernote`, `Bear`, `OneNote`...
- 不用擔心資料被公司綁架

- LV.2 ➜ 點下按鈕之後
- 可以把文字傳送到 【HackMD】 自動備份成筆記

>
> - 【HackMD】_API
>
> - https://blog.hackmd.io/zh/blog/2022/02/11/api_beta_zh
> - https://documenter.getpostman.com/view/68277/UVeNmhpT
>