寫網頁這件事發生在我12歲和32歲中,中間空白了20年。
在國小經歷用 table 排版、用 FrontPage 切割導覽列這寫現在回頭來看不可思議的過程(笑),年過30才又回頭想寫網頁的我除了感嘆技術發展之快與越來越便利之外,更便利的是知識的取得變得更簡單了。
由於大學的劇場服裝專業並不是一個容易有職缺的領域(在台灣,劇場工作多半也是靠著劇場人脈在進行短期的合作,少有公開職缺),加上缺乏良好的當地語言能力,我在瑞典求職一直不順,這讓我開始想著回台灣後是不是可以多做些什麼。
先是購買了自學課程快速摸到html和CSS的基礎後,應徵上目前的工作,維護與製作公司的活動網頁。在工作中遇到需求就邊做邊找答案,慢慢熟悉了html和CSS的使用,加上好用的Bootstrap,幾乎能完成所有公司派給我的工作。但對於javascript的部分,不像css那樣直覺好讀,所寫及所見,可以邊改邊試邊學習,總是只能抄別人寫好的來用,真的是連怎麼改都不會改,每每想做一些更友善使用者的功能或是可以更快解決公司來的重覆需求時,就會感嘆所學不足。
終於在32歲這年,和當初——因為喜歡上Cosplay而轉成將課餘時間都拿去點修圖、畫圖、製衣技能而——荒廢沒有繼續寫網頁的那個12歲的自己再次延續上了。
我報了另一個課程。
有別於上次全端課程的龐雜內容,我真正比較有興趣的前端部分都比較簡單帶過,在職場中才一一花時間學回來,這次選了明確範圍的網頁前端課程。加上有了上一次買課程自學的經驗,我了解到自己為何先前的課程來到javascript後不管介紹課程看幾遍都還是無法往下走後面的單元。所以在這次買課程時格外謹慎,透過瞭解課程如何進行與試讀,大量的小單元作業,循序漸進的說明,還不用現在懂的概念就先安心放著等等的課程設計,加上完課獎學金的鼓勵,我順利完成了第一個月的學習。
我真的很喜歡課程的設計。
麻花辮式的將CSS和javascrip交互排進進度,讓兩者可以相輔相成,透過每個階段小作業所需的知識馬上活用兩者。
當然javascrip的篇幅還是多一點,但這對我而言正好,已經會的CSS的部分比較像是複習和釐清之前自學時似懂非懂而用就好的部分。
而在javascrip的課程裡,透過一點一點的概念介紹,一步一步跟著作業的設計,完成一個乍看需求重多會難以開始的程式撰寫。
好了,講了這麼多,我要來分享我第一週的作業:週年慶摸彩活動
透過字串處理、加密參加者的基本資訊、踢除黑名單、封裝函式、選出幸運兒到將前面的每個段落整合完整執行。
一、字串處理:
製造彩券號碼,並必須符合以下條件:分別、獨立產生六個字符。前兩個字符為大寫英文字母後四個字符為數字。
作業看這邊>>https://replit.com/@cimmeriandead/S1A1Q1Cai-Quan-Hao-Ma-Chan-Sheng-Ji#index.js
二、加密參加者的資本資訊:
將參加者的姓名與email依需求加密。
作業看這邊>>
加密姓名 https://replit.com/@cimmeriandead/S1A1Q2-Jia-Mi-Xing-Ming#index.js
加密email https://replit.com/@cimmeriandead/S1A1Q3-Jia-Mi-Xin-Xiang#index.js
三、踢除黑名單:
將黑名單中的參加者排除。
作業看這邊>>
https://replit.com/@cimmeriandead/S1A2Q1-Dan-Chun-De-Zhen-Lie#index.js
https://replit.com/@cimmeriandead/S1A2Q2Ma-Fan-De-Zhen-Lie#index.js
四、封裝函式:
將上面三個功能的程式碼封裝成可重覆使用的函式。
作業看這邊>> https://replit.com/@cimmeriandead/S1A3#index.js
五、選出幸運兒:
從參加者中選出5個幸運兒,每人只能中獎一次。
作業看這邊>> https://replit.com/@cimmeriandead/S1A4Q1-Shui-Shi-Xing-Yun-Er#index.js
六、完整執行:
綜合上面五個練習,產出完整的摸彩箱!
https://replit.com/@cimmeriandead/S1A5-Zhou-Nian-Qing-Mo-Cai-Huo-Dong-Wan-Zheng-Zhi-Xing#index.js
第一週就在這樣按步就班的引導下,完成了一個開課前完全不覺得自己辦得到的事!
而每個小作業除了運用課堂所學,在作業中也特會別提示要使用哪些函數或用什麼方法才解決,讓人有充分學以致用的成就感。
雖然作業中也會有些小卡關,但也都能透過助教提示、示範或同學作業的觀摩中得到解答,有點難又不會難到讓你絕望寫不出來,問題適時可以求得解決。
而作業也不是問題解決了交出去就好,交作業時會一併被要求寫下寫作業時遇到的狀況,自己學習階段的困擾和成長都能完整記錄在自己的學習平臺中。
中間當然也有很多小作業,這邊最後再分享這個月最後的作業:My Favorite Movies
1. 顯示資料中的電影,列成電影清單。
2. 可加減評分電影
3. 可刪除電影項目
作業看這邊>> https://codepen.io/tsouhare/pen/dyeNWrY
由於是一邊上班一邊學習,為了跟上進度其實沒有把選修課程和挑戰作頁完成,以最低限度能往下走為基準參與課程。
生為社畜要一面維持往常和先生、家人、寵物、朋友的情感陪伴需求,一面又要投入學習新東西,老實說時間真的不多。
但上完這一個月,課程給予的樂趣和成就感讓我願意少睡一點或少滑一點臉書,盡量不減少給家人的時間,應該還行!我要繼續下面的課程了!