if540/Bookmark

## Bookmark
git 教
- https://github.com/mylxsw/growing-up/blob/master/doc/%E7%A0%94%E5%8F%91%E5%9B%A2%E9%98%9FGIT%E5%BC%80%E5%8F%91%E6%B5%81%E7%A8%8B%E6%96%B0%E4%BA%BA%E5%AD%A6%E4%B9%A0%E6%8C%87%E5%8D%97.md
- https://kingofamani.gitbooks.io/git-teach/content/chapter_3_branch/git.html

C# https://docs.microsoft.com/zh-tw/dotnet/csharp/language-reference/keywords/enum

canvas flash 分層 - https://www.ibm.com/developerworks/cn/web/wa-canvashtml5layering/index.html

UIUX class - https://xue.uisdc.com/ixd/

https://laracasts.com/series/testing-vue

framerjs - https://www.framer.com/design/

https://www.liaoxuefeng.com/wiki/1022910821149312/1109551359195584
https://medium.com/fullstackio/managing-state-in-vue-js-23a0352b1c87
https://nativescript-vue.org/cn/
https://zhuanlan.zhihu.com/p/36369422
https://www.msn.com/zh-tw/lifestyle/lifestyleliving/迪士尼動畫的人生哲理%ef%bc%8112-句經典台詞%ef%bc%8c帶你找回勇敢的自己/ar-AAAXMPs?ocid=spartandhp

https://airtable.com/
https://medium.com/javascript-scene
https://medium.com/javascript-scene/tdd-changed-my-life-5af0ce099f80
https://medium.com/as-a-product-designer/a-better-web-development-workflow-confluence-airtable-jira-abstract-zh-24fc8d5b8329

socket
https://ithelp.ithome.com.tw/users/20000108/ironman/506

// 優化
https://medium.com/frochu/webpack-commons-chunk-plugin-f2e4bd853c26

// 推薦套件
// jQuery
xpull - https://github.com/sjovanovic/xpull
// Vue
https://github.com/bassdman/vue-feature-toggle

// 線上課
https://ke.qq.com/course/list?mt=1001&st=2004&tt=3322

// typescript
https://juejin.im/post/5b3b9729f265da0f4b7a6e08
AOP - https://nullcc.github.io/2019/01/11/AOP%E5%9C%A8JavaScript%E5%92%8CTypeScript%E4%B8%AD%E7%9A%84%E5%BA%94%E7%94%A8/

// how to make api calls
https://nick-basile.com/blog/post/how-to-make-api-calls-with-vuex

// 練功
https://github.com/ilyagru/Space-Snake?ref=madewithvuejs.com
https://www.w3cplus.com/vue/vue-extend.html

// bookmark
https://zh-tw.coursera.org/lecture/unity-kaifa-jinjie/you-xi-zhuang-tai-guan-li-yan-shi-huan-jie-gnSIW
https://aotu.io/index.html

https://github.com/egoist/saber

// Design Token
https://amzn.github.io/style-dictionary
https://css-tricks.com/what-are-design-tokens/
https://zhuanlan.zhihu.com/p/32548767
https://styled-system.com/getting-started/

// 模塊化系統架構設計實踐
// 這個的前提基礎是設計師需要在日常時間不斷的打磨已有的基礎組件，同時不斷豐富組件庫，將日常的設計工作轉化為去創新設計新的功能組件，而不是消耗在繁瑣的排版、貼圖、打標等重複性工作中。
https://zhuanlan.zhihu.com/p/34506660

// icon
https://www.iconfont.cn

// PWA
https://juejin.im/e/pwa-lavas

// Art
https://www.artstation.com/enricot
https://meia.me/
http://www.aliued.com/
https://www.uisdc.com

// sass OOP
sass OOP 概念 - https://blog.chh.tw/posts/scss-object-oriented/
OOP - http://oxygencss.com/
styleguid - http://styleguides.io/
styleguid io - http://atomicdocs.io/

designer youtube - https://www.youtube.com/channel/UCOJH-EjXw6ZDTo6Tk_8uPCA/videos
designer media - https://medium.com/deerlight/%E5%A5%BD%E8%AE%80%E7%9A%84%E6%8E%92%E7%89%88%E6%8C%87%E5%8D%97-34b9d2a0ca23
designer - https://iamsteve.me/blog/entry/a-guide-to-vertical-rhythm

// io tools
https://cssgradient.io/ 上傳圖可自動抓色

// Vertical Rhythm
https://zellwk.com/blog/why-vertical-rhythms/
https://builttoadapt.io/8-point-grid-vertical-rhythm-90d05ad95032
https://iamsteve.me/blog/entry/a-guide-to-vertical-rhythm
http://joshnh.com/tools/em-baseline-generator.html
https://drewish.com/tools/vertical-rhythm/
https://www.slideshare.net/sfismy/vertical-rhythm
http://webtypography.net/2.2.2
https://blog.prototypr.io/defining-a-modular-type-scale-for-web-ui-51acd5df31aa
https://medium.com/codyhouse/create-your-design-system-part-4-spacing-895c9213e2b9

https://css.hanzi.co/
https://typo.sofi.sh/

// breakpoint 思
https://github.com/ecomfe/rider/blob/master/doc/breakpoint.md

免費線上出圖 - https://processon.com/
animejs - https://animejs.com/
codecasts - https://www.codecasts.com/
https://vueschool.io/courses/nuxtjs-fundamentals/?friend=nuxt
Game case - https://www.miumiu.com/miumiu-twist/cn/

https://womany.net/read/article/15592

vue reactivity - https://pjchender.blogspot.com/2017/05/vue-vue-reactivity.html

js - https://plus.google.com/+FredChien
toLocaleString - https://juejin.im/post/5ac7079f5188255c637b3233

前端影音文章 - https://ithelp.ithome.com.tw/users/20104221/ironman/2067
game - http://gad.qq.com/article/detail/285933

https://www.zcfy.cc - 翻译，从此起步 - 众成翻译
https://www.zcfy.cc/article/clean-code-javascript-readme-md-at-master-ryanmcdermott-clean-code-javascript-github-2273.html# - JavaScript 代碼整潔之道
https://lq782655835.github.io/blogs/js/js-design-pattern.html - JS設計模式

speed/validity selectors test for frameworks - http://test.veryos.com/selector/slickspeed/index.html
天天都在使用CSS，那麼CSS的原理是什麼呢？ - http://www.fly63.com/article/detial/1873
CSS規範 - 優化方案 - http://nec.netease.com/standard/css-optimize.html

設計模式解說 - http://luopq.com/2015/11/10/desgin-pattern-adapter/

十全乾貨：核心遊戲系統架構設計 - http://gad.qq.com/article/detail/22149

performance-budget - http://bradfrost.com/blog/post/performance-budget-builder/

https://zi.media/@yidianzixun/post/g8d172 - 全面解析 | 如何做好輸出「需求文檔」這件「小事」？
https://zi.media/@yidianzixun/post/yrwMvm - 案例解析｜如何做一份簡潔而有重點的的需求文檔
https://www.ithome.com.tw/node/74589 - 流程圖共同語言
https://blog.csdn.net/erlib/article/details/54927763 - 開發

// 動態規劃
https://juejin.im/post/5c5ba697f265da2d8b6319f6
https://www.itread01.com/content/1546866933.html
https://www.youtube.com/watch?v=1BAsAgdx7Ac
https://juejin.im/post/5c623ff3f265da2de1657f97#heading-4

// 理解JS執行環境
https://andyyou.github.io/2015/04/18/what-is-the-execution-context-in-javascript/

// Promise 入門
https://juejin.im/post/5c2db051e51d452626299650

// Vue 學習
https://www.csdn.net/article/2015-08-11/2825439-vue - 優化
https://segmentfault.com/a/1190000012631049#articleHeader2 - 優化
https://segmentfault.com/a/1190000009443366 - 優化
https://www.jianshu.com/p/41075f1f5297 - 優化

https://github.com/Kelichao/vue.js.2.0/issues/19 - 自定義事件$on/$emit
https://www.vuemastery.com/courses - 免費課程
https://ustbhuangyi.github.io/vue-analysis/vuex/api.html#%E8%AF%AD%E6%B3%95%E7%B3%96 - 作詳解

//
重繪，回流和合成，瞭解基本瀏覽器繪製幫你優化頁面性能
https://zhuanlan.zhihu.com/p/23428399

// 星巴克開放案例
https://juejin.im/post/5c19c7f7f265da61587717cc

// svg
再談 SVG vs Image vs Iconfont
http://www.yyyweb.com/5228.html

// 深入VUEJS
keep-alive - https://github.com/answershuto/learnVue/blob/master/docs/%E8%81%8A%E8%81%8Akeep-alive%E7%BB%84%E4%BB%B6%E7%9A%84%E4%BD%BF%E7%94%A8%E5%8F%8A%E5%85%B6%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86.MarkDown
https://stackoverflow.com/questions/49517443/vue-js-cant-understand-keep-alive

// 跟自已對話
http://betweengos.com/career-3-types-of-programmer-coder-hacker-architect/ - 如果妳也開始學寫Code－依個性分類，會是哪種程式設計師？
https://www.cheers.com.tw/article/article.action?id=5089320

https://www.homify.tw/professionals/2369545/unicorn-design

## Vue.md

      
    Raw
  

              Vue.md
            
          
    vue-router
CommonJS Require
const VueRouter = require('vue-router').default
https://stackoverflow.com/questions/42549580/vue-jsvue-router-is-not-constructor-error-in-simple-route
// 錯誤訊息
[Vue warn]: Failed to mount component: template or render function not defined. (found in root instance)
https://zhuanlan.zhihu.com/p/25486761
// 全局異步加載
// Vue.component('comp-async', function (resolve) {
//   require(['./pages/comp.vue'], resolve)
// })

  
## work.md

      
    Raw
  

              work.md
            
          
    視訊解碼 - https://github.com/phoboslab/jsmpeg
打包分析 - https://segmentfault.com/a/1190000012220132
webpack3To4 - https://www.cnblogs.com/qingmingsang/articles/9231205.html

  
## 容器元作與展示元件.md

      
    Raw
  

              容器元作與展示元件.md
            
          
    軟體系統架構

在軟體系統架構中，軟體一般分為三個層次：表示層、業務邏輯層和資料訪問層
表示層

業務邏輯層


業務邏輯詳解

資料訪問層

組件化組織 - 借鏡Redux框架中的容器組件(Smart Component)和展示組件(Dumb Component)
http://www.icode9.com/content-4-101221.html
https://www.jianshu.com/p/09193c777add
https://imys.net/20170317/write-good-front-end-component.html#%E4%B8%9A%E5%8A%A1%E7%BB%84%E4%BB%B6
https://www.html.cn/archives/9458
遊戲分層設計
https://indienova.com/indie-game-development/hierarchical-design-in-unity/
設計模式
https://gof.quanke.name/
Vue組件化規範
https://medium.com/tldr-tech/vue-js-component-style-guide-711988d5e94e
https://pablohpsilva.github.io/vuejs-component-style-guide/#/chinese?id=%E4%B8%BA%E4%BB%80%E4%B9%88
組件庫搭建
https://www.zcool.com.cn/article/ZODI0MzQ0.html
https://www.iacblog.com/2018/10/193.html
https://kknews.cc/design/3no2l6a.html
https://juejin.im/post/5bbab9de5188255c8c0cb0e3#heading-21
經驗談
http://blog.johnsenzhou.com/2018/%E5%85%AC%E5%8F%B8vue%E7%BB%84%E4%BB%B6%E5%BA%93%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97
https://github.com/EwellFE/evell
Webpack
http://www.alloyteam.com/2017/07/12918/ - 如何在 vue 裡使用 jsx

A better web development workflow
https://medium.com/free-code-camp/a-better-web-development-workflow-confluence-airtable-jira-abstract-e626ef4ff5bc
有限狀態機（FSM）
https://www.vinceshao.com/blog/how-to-design-ui-states-and-communicate-with-developers-using-fsm-table/

元件驅動測試(CCD)! VS StoryBook


https://www.learnstorybook.com/react/zh-tw/simple-component/
https://juejin.im/post/5c307916e51d4551e418baa0
http://ics.carbondesignsystem.com/?selectedKind=Welcome%7CGetting%20started&selectedStory=Usage&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybooks%2Fstorybook-addon-knobs


## 組織優雅的代碼.md

      
    Raw
  

              組織優雅的代碼.md
            
          
    https://www.jianshu.com/p/018074c55cd1
https://www.jianshu.com/p/0701f991b017

文檔編寫

https://vuepress.vuejs.org/zh/
	git 教
	- https://github.com/mylxsw/growing-up/blob/master/doc/%E7%A0%94%E5%8F%91%E5%9B%A2%E9%98%9FGIT%E5%BC%80%E5%8F%91%E6%B5%81%E7%A8%8B%E6%96%B0%E4%BA%BA%E5%AD%A6%E4%B9%A0%E6%8C%87%E5%8D%97.md
	- https://kingofamani.gitbooks.io/git-teach/content/chapter_3_branch/git.html

	C# https://docs.microsoft.com/zh-tw/dotnet/csharp/language-reference/keywords/enum

	canvas flash 分層 - https://www.ibm.com/developerworks/cn/web/wa-canvashtml5layering/index.html

	UIUX class - https://xue.uisdc.com/ixd/

	https://laracasts.com/series/testing-vue

	framerjs - https://www.framer.com/design/

	https://www.liaoxuefeng.com/wiki/1022910821149312/1109551359195584
	https://medium.com/fullstackio/managing-state-in-vue-js-23a0352b1c87
	https://nativescript-vue.org/cn/
	https://zhuanlan.zhihu.com/p/36369422
	https://www.msn.com/zh-tw/lifestyle/lifestyleliving/迪士尼動畫的人生哲理%ef%bc%8112-句經典台詞%ef%bc%8c帶你找回勇敢的自己/ar-AAAXMPs?ocid=spartandhp

	https://airtable.com/
	https://medium.com/javascript-scene
	https://medium.com/javascript-scene/tdd-changed-my-life-5af0ce099f80
	https://medium.com/as-a-product-designer/a-better-web-development-workflow-confluence-airtable-jira-abstract-zh-24fc8d5b8329

	socket
	https://ithelp.ithome.com.tw/users/20000108/ironman/506

	// 優化
	https://medium.com/frochu/webpack-commons-chunk-plugin-f2e4bd853c26

	// 推薦套件
	// jQuery
	xpull - https://github.com/sjovanovic/xpull
	// Vue
	https://github.com/bassdman/vue-feature-toggle

	// 線上課
	https://ke.qq.com/course/list?mt=1001&st=2004&tt=3322

	// typescript
	https://juejin.im/post/5b3b9729f265da0f4b7a6e08
	AOP - https://nullcc.github.io/2019/01/11/AOP%E5%9C%A8JavaScript%E5%92%8CTypeScript%E4%B8%AD%E7%9A%84%E5%BA%94%E7%94%A8/

	// how to make api calls
	https://nick-basile.com/blog/post/how-to-make-api-calls-with-vuex

	// 練功
	https://github.com/ilyagru/Space-Snake?ref=madewithvuejs.com
	https://www.w3cplus.com/vue/vue-extend.html

	// bookmark
	https://zh-tw.coursera.org/lecture/unity-kaifa-jinjie/you-xi-zhuang-tai-guan-li-yan-shi-huan-jie-gnSIW
	https://aotu.io/index.html

	https://github.com/egoist/saber

	// Design Token
	https://amzn.github.io/style-dictionary
	https://css-tricks.com/what-are-design-tokens/
	https://zhuanlan.zhihu.com/p/32548767
	https://styled-system.com/getting-started/

	// 模塊化系統架構設計實踐
	// 這個的前提基礎是設計師需要在日常時間不斷的打磨已有的基礎組件，同時不斷豐富組件庫，將日常的設計工作轉化為去創新設計新的功能組件，而不是消耗在繁瑣的排版、貼圖、打標等重複性工作中。
	https://zhuanlan.zhihu.com/p/34506660

	// icon
	https://www.iconfont.cn

	// PWA
	https://juejin.im/e/pwa-lavas

	// Art
	https://www.artstation.com/enricot
	https://meia.me/
	http://www.aliued.com/
	https://www.uisdc.com

	// sass OOP
	sass OOP 概念 - https://blog.chh.tw/posts/scss-object-oriented/
	OOP - http://oxygencss.com/
	styleguid - http://styleguides.io/
	styleguid io - http://atomicdocs.io/

	designer youtube - https://www.youtube.com/channel/UCOJH-EjXw6ZDTo6Tk_8uPCA/videos
	designer media - https://medium.com/deerlight/%E5%A5%BD%E8%AE%80%E7%9A%84%E6%8E%92%E7%89%88%E6%8C%87%E5%8D%97-34b9d2a0ca23
	designer - https://iamsteve.me/blog/entry/a-guide-to-vertical-rhythm

	// io tools
	https://cssgradient.io/ 上傳圖可自動抓色

	// Vertical Rhythm
	https://zellwk.com/blog/why-vertical-rhythms/
	https://builttoadapt.io/8-point-grid-vertical-rhythm-90d05ad95032
	https://iamsteve.me/blog/entry/a-guide-to-vertical-rhythm
	http://joshnh.com/tools/em-baseline-generator.html
	https://drewish.com/tools/vertical-rhythm/
	https://www.slideshare.net/sfismy/vertical-rhythm
	http://webtypography.net/2.2.2
	https://blog.prototypr.io/defining-a-modular-type-scale-for-web-ui-51acd5df31aa
	https://medium.com/codyhouse/create-your-design-system-part-4-spacing-895c9213e2b9

	https://css.hanzi.co/
	https://typo.sofi.sh/

	// breakpoint 思
	https://github.com/ecomfe/rider/blob/master/doc/breakpoint.md

	免費線上出圖 - https://processon.com/
	animejs - https://animejs.com/
	codecasts - https://www.codecasts.com/
	https://vueschool.io/courses/nuxtjs-fundamentals/?friend=nuxt
	Game case - https://www.miumiu.com/miumiu-twist/cn/

	https://womany.net/read/article/15592

	vue reactivity - https://pjchender.blogspot.com/2017/05/vue-vue-reactivity.html

	js - https://plus.google.com/+FredChien
	toLocaleString - https://juejin.im/post/5ac7079f5188255c637b3233

	前端影音文章 - https://ithelp.ithome.com.tw/users/20104221/ironman/2067
	game - http://gad.qq.com/article/detail/285933

	https://www.zcfy.cc - 翻译，从此起步 - 众成翻译
	https://www.zcfy.cc/article/clean-code-javascript-readme-md-at-master-ryanmcdermott-clean-code-javascript-github-2273.html# - JavaScript 代碼整潔之道
	https://lq782655835.github.io/blogs/js/js-design-pattern.html - JS設計模式

	speed/validity selectors test for frameworks - http://test.veryos.com/selector/slickspeed/index.html
	天天都在使用CSS，那麼CSS的原理是什麼呢？ - http://www.fly63.com/article/detial/1873
	CSS規範 - 優化方案 - http://nec.netease.com/standard/css-optimize.html

	設計模式解說 - http://luopq.com/2015/11/10/desgin-pattern-adapter/

	十全乾貨：核心遊戲系統架構設計 - http://gad.qq.com/article/detail/22149

	performance-budget - http://bradfrost.com/blog/post/performance-budget-builder/

	https://zi.media/@yidianzixun/post/g8d172 - 全面解析 \| 如何做好輸出「需求文檔」這件「小事」？
	https://zi.media/@yidianzixun/post/yrwMvm - 案例解析｜如何做一份簡潔而有重點的的需求文檔
	https://www.ithome.com.tw/node/74589 - 流程圖共同語言
	https://blog.csdn.net/erlib/article/details/54927763 - 開發

	// 動態規劃
	https://juejin.im/post/5c5ba697f265da2d8b6319f6
	https://www.itread01.com/content/1546866933.html
	https://www.youtube.com/watch?v=1BAsAgdx7Ac
	https://juejin.im/post/5c623ff3f265da2de1657f97#heading-4

	// 理解JS執行環境
	https://andyyou.github.io/2015/04/18/what-is-the-execution-context-in-javascript/

	// Promise 入門
	https://juejin.im/post/5c2db051e51d452626299650

	// Vue 學習
	https://www.csdn.net/article/2015-08-11/2825439-vue - 優化
	https://segmentfault.com/a/1190000012631049#articleHeader2 - 優化
	https://segmentfault.com/a/1190000009443366 - 優化
	https://www.jianshu.com/p/41075f1f5297 - 優化

	https://github.com/Kelichao/vue.js.2.0/issues/19 - 自定義事件$on/$emit
	https://www.vuemastery.com/courses - 免費課程
	https://ustbhuangyi.github.io/vue-analysis/vuex/api.html#%E8%AF%AD%E6%B3%95%E7%B3%96 - 作詳解

	//
	重繪，回流和合成，瞭解基本瀏覽器繪製幫你優化頁面性能
	https://zhuanlan.zhihu.com/p/23428399

	// 星巴克開放案例
	https://juejin.im/post/5c19c7f7f265da61587717cc

	// svg
	再談 SVG vs Image vs Iconfont
	http://www.yyyweb.com/5228.html

	// 深入VUEJS
	keep-alive - https://github.com/answershuto/learnVue/blob/master/docs/%E8%81%8A%E8%81%8Akeep-alive%E7%BB%84%E4%BB%B6%E7%9A%84%E4%BD%BF%E7%94%A8%E5%8F%8A%E5%85%B6%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86.MarkDown
	https://stackoverflow.com/questions/49517443/vue-js-cant-understand-keep-alive

	// 跟自已對話
	http://betweengos.com/career-3-types-of-programmer-coder-hacker-architect/ - 如果妳也開始學寫Code－依個性分類，會是哪種程式設計師？
	https://www.cheers.com.tw/article/article.action?id=5089320

	https://www.homify.tw/professionals/2369545/unicorn-design