iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

前端幼鳥三十天養成記 系列

比菜鳥還菜的幼鳥 - 稚鳥我本人,不知道30天後,會不會變成烤小鳥??
從最基礎的css開始(html應該會跳過),希望最後可以學到vue或react(擇一)框架。
寫不寫得到是個未知數 哈哈哈哈哈
中間會參雜一些uiux的設計思路。

最終的實作,希望可以是食譜網站(前端部分)。

鐵人鍊成 | 共 30 篇文章 | 6 人訂閱 訂閱系列文 RSS系列文
DAY 1

DAY1 築個前端毛胚屋

嗨我是稚鳥。這是一個for比菜鳥還菜的幼鳥前端指南。 幼鳥品種說明:學過一種程式語言,但對前端沒啥概念 這系列會講:一米米的HTML,一點點的CSS ,和JS...

2021-09-06 ‧ 由 ChihBird稚鳥 分享
DAY 2

DAY2 FLOAT佈局 - 搞懂他愛出軌的心

佈局的方法很多,float是比較難懂的一個。float的經典有文繞圖、三欄佈局中的聖杯佈局和雙飛翼佈局。 為甚麼說他愛出軌呢? 當元素有屬性float時,他會離...

2021-09-07 ‧ 由 ChihBird稚鳥 分享
DAY 3

DAY3 聖杯布局 - 三個欄的C位爭奪戰(上)

聖杯和雙飛翼,是布局PC常見的方法。上下有header,footer,中間三欄center,left,right並排。明天會總結兩個的不同,內容有點硬,堅持住看...

2021-09-08 ‧ 由 ChihBird稚鳥 分享
DAY 4

DAY4 雙飛翼布局 - 三個欄的C位爭奪戰(下)

雙飛翼和聖杯不同的是,雙飛翼在<main>裏面放一個子元素。聖杯是在外面包一個父元素。html css基本設定,大致一樣,只差 少了個<di...

2021-09-09 ‧ 由 ChihBird稚鳥 分享
DAY 5

DAY5 速談flex gride布局、定位、響應式

為了加快進度,我要快速帶過flex、gride布局、定位和響應式,幫你繫個安全戴,要飆車囉~~ flex : 學習方法→邊玩蛙蛙回家,邊看連結2的說明 遊...

2021-09-10 ‧ 由 ChihBird稚鳥 分享
DAY 6

DAY6 JS跑在瀏覽器上的怪問題們

簡單回顧一下,第一天講了HTML5常用的幾種tag。二到四天,深入聊了CSS中float原理,實作聖杯和雙飛翼,兩個常見的pc布局。第五天迅速的帶過其他布局、定...

2021-09-11 ‧ 由 ChihBird稚鳥 分享
DAY 7

DAY7 淺扒網路 - 估計被扒皮的是我不是網路

「將127.0.0.1改成內網IP」,這是上一篇的某個步驟,沒淺淺扒一下網路基礎,對學習有點影響~~ --- ## 回到源頭 我們要網路幹啥? step1拋掉...

2021-09-12 ‧ 由 ChihBird稚鳥 分享
DAY 8

變數 基礎

簡單介紹一下變數在JS中的幾個性質,之後的篇章會比較深入的講解,這些性質背後的原因們 看變數的值,決定是數字、字串還是... var a=1; var b='...

2021-09-13 ‧ 由 ChihBird稚鳥 分享
DAY 9

DAY9 樣式屬性權重 - Nav Bar實作之遇到的小卡頓

錯誤版 正確版 比對兩個,發現哪裡有bug了嗎? 對就是,鼠標移開後,樣式應該變回原本的,但它沒有。我們來看看程式碼錯在哪? 錯誤版 <script&...

2021-09-14 ‧ 由 ChihBird稚鳥 分享
DAY 10

建JS環境 Node Nodemon

我們飛快的結束惹html ,css,歡迎進入到下一個階段JavaScrip。JS的助教很嚴,學習之前有個入學考-建立JS環境。稚鳥本鳥這次碰和去年隨便碰的時候,...

2021-09-15 ‧ 由 ChihBird稚鳥 分享