2019年3月10日 星期日

個人網站開發 (1)

從去年11月開始, 由於工作需求有時候需要處理一些前端相關的case, 不過自己前端技能點數幾乎為0(以前只寫過簡單的html跟js), 修個bug改點css調個layout或許還行, 可是要是哪天要我寫整個網站, 我八成就要準備升天了, 有鑑於此, 乾脆趁這時候重新開始學習前端開發的技能好了。

目前的學習計畫是, 先把前端的線上學習課程有系統的上個一輪(html, css, javascript以及進階的框架使用, 目前codecademy免錢的部分幾乎快上完了, 不過感覺也只是有個概念, 沒有真的下去做技能還是練不起來), 另外想說也來寫個介紹自己side projects的個人網站, 畢竟有實作才知道自己會遇到那些問題啊...。

首先, 由於不想從頭手刻到尾(真這樣等我刻完不知道要到西元幾年...畢竟只能用下班&休假寫啊), 所以第一步就是想找有哪些open source的網站可以當初始的版面, 再來慢慢改成自己想要的style. 幾番搜尋之後, 最後發現yelp.github.io的網站做得很棒, 有接github的api展現自己open source專案, 頁面簡潔好看又是Apache License, 就決定以這個做為基礎版面了。

決定好基礎版面之後, 就開始設計&實作設計啦, 首先先想好並列出自己想要的功能:
  1. 有些自己的side project並沒有放在github上, 還有一些學生時代做的小玩意也想做個介紹網頁放上來, 所以不能只靠github api取得的data, 還必須有個virtual repositories讓我能放自定義的網頁。
  2. 以前逛網站看到一些粒子特效覺得超級炫, 也想讓自己的網站有些酷炫的特效(超推薦codepen.io這個網站, 資源超級多又能即時demo, 又是MIT Licensed, 超級感謝有這網站以及上面大大們的分享)。
  3. yelp的meun-bar並沒有下拉式選單的功能, 這個我希望自己的網站要有, 所以也要做。
  4. etc...
再來就是美術素材部分, 這邊就包給我哥處理啦XDDD  這塊認真說最難搞, 畢竟我不會畫圖, 只能慢慢等我哥生出來, 不過這也間接造成我的惰性, 沒有素材的情況在開發時, 真的是呈現三天捕魚兩天曬網的情況, 這也讓我下定決心, 這個網站開發不能一步到位了, 我打算先把最想做的幾頁做出來後, 就先去想下個side project要做什麼, 畢竟我個人對前端的興趣雖然說有, 可是並不想一直花技能點數下去啊!!

目前總算初版做出來了:
https://project.zmcx16.moe/



除了首頁的之外, 因為MahoMangaDownloader並沒有放到Github上, 所以也做了MahoMangaDownloader的介紹頁:
https://project.zmcx16.moe/?page=MahoMangaDownloader

(以前都是用Blog作為介紹 & 更新頁, 現在總算有專屬頁面了, 雖然很陽春啦XD)

再做MahoMangaDownloader的介紹頁時, 花最多時間的竟然是在選漫畫demo的圖上面, 我用掉了整個過年看了超過100本漫畫, 然後過完年後再把這些圖組成分隔圖, 現在想想自己原本是為了網頁素材看漫畫, 結果最後反而還真的都變成在看漫畫了, 這實在是太扯了WWWWW

再來的計劃嘛, 目前打算在做個misc頁面, 把學生時代做的一些東西做成一個介紹網頁, 然後就繼續想想再來能做什麼吧~。




6 則留言:

  1. 想請問漫畫demo裡 有一張正中間下面一格是哪部漫畫?
    台詞為"你看!這樣看起來就像天使了吧?"
    謝謝!

    回覆刪除
    回覆
    1. 這部是TIGER×DRAGON!(中文譯名: 虎與龍), 原作是輕小說, 有改編成是動畫跟漫畫。

      小說10+OVA3完結, 動畫劇情跟小說差不多, 只有一些些細節不一樣, 我個人超喜歡這部作品!!!

      刪除
    2. 什麼!! 那個原來是大河醬!!難怪覺得台詞很眼熟
      當初只有看完動畫版 是時候補漫畫版啦!!
      記得妹抖醬常常有提到TIGER×DRAGON跟櫻花莊的女孩
      還有預設漫畫的智醬是女生 是時候三個一起補起來了
      非常謝謝您的解答!!

      刪除
    3. 不客氣~~~虎與龍真的是神作阿XD 漫畫版出得比較慢, 比較期待後面看能不能有番外劇情。 另外虎與龍小說OVA也很推薦追, 可以看到各種番外故事, PSP的虎與龍劇情也很不錯, 尤其是亞美線的兩個結局做的超用心。

      櫻花莊的寵物女孩我只有看動畫, 也是強力推薦, 跟虎與龍一樣滿滿的青春味XD

      刪除
  2. 推一個
    漫畫下載器的忠實粉XD

    順便問一下網頁最下面大家在屋頂一起吃火鍋是哪部作品呢?
    我很好奇(千反田臉www

    回覆刪除
    回覆
    1. 你好, 感謝支持XD 那部是櫻花莊的寵物女孩, 下載器的女僕醬也是該部作品的角色, 動畫非常推薦~~~!!!

      刪除