frontend4luv

[frontend4luv]

jsで気になることのメモ

JS行末セミコロン自動挿入 https://blog.tai2.net/automatic_semilocon_insertion.html

JavaScriptのセミコロンを省くと起こること https://qiita.com/igayamaguchi/items/ac48b7e12890351ee55a

VSコード https://stackoverflow.com/questions/30118344/how-to-add-semicolon-to-the-end-of-the-line-in-visual-studio-code/37490039 https://marketplace.visualstudio.com/items?itemName=vmsynkov.colonize

[frontend4luv]

メモ

20 best web design magazines https://www.templatemonster.com/blog/best-graphic-design-magazines/

10 print magazines for web designers https://www.awwwards.com/10-print-magazines-web-design.html

best website examples of react JS https://www.awwwards.com/websites/reactjsdah/

PureRef https://3dnchu.com/archives/pureref/

[frontend4luv]

FitbitのSDK

fitbit SDK https://dev.fitbit.com/getting-started/

[frontend4luv]

スタイルとか

theme your app with styled components in vue.js https://dev.to/codestuff2/theme-your-app-with-styled-components-in-vue-28h0

styled component https://blog.spacemarket.com/code/introduce_styled_components/

pug with react https://github.com/pugjs/babel-plugin-transform-react-pug

CSS clip-path maker https://bennettfeely.com/clippy/

[frontend4luv]

JSライブラリ

### JS ライブラリ ###

video.js https://videojs.com/fantasy

vue.jsのコンポーネント詰め合わせ - element https://s8a.jp/vue-js-library-element

leaflet - mapライブラリ https://leafletjs.com/

2019注目のJSアニメーションライブラリ https://qiita.com/baby-degu/items/2516bb55e97de612118b

[frontend4luv]

フロントのツール

Getting Started with Gulp - Second Edition https://subscription.packtpub.com/book/application-development/9781787283732

Gulp（ガルプ）を使ってWeb開発の面倒なタスクを自動化しよう！ https://tracpath.com/works/development/gulp-automate-and-enhance-your-workflow/

Gulp.jsとPostCSSを使ってCSSの面倒な作業をなくそう https://liginc.co.jp/206518

webpack 4 入門 https://qiita.com/soarflat/items/28bf799f7e0335b68186

Web Development with Angular and Webpack 4 https://subscription.packtpub.com/video/web_development/9781789340150

Webpack for React Applications https://subscription.packtpub.com/video/web_development/9781788472203

[frontend4luv]

フロントエンドの勉強なる記事

martian chronicles - svg https://evilmartians.com/chronicles/images-done-right-web-graphics-good-to-the-last-byte-optimization-techniques#svg-scales-very-good

Angular6 から始める RxJS6 入門 https://qiita.com/MasanobuAkiba/items/a5026bd37603cc29e9e7

おまえはReact hooksを知っているか https://qiita.com/hystking/items/2a082ee86dc0b66793cb

next.js https://qiita.com/nkzawa/items/1e0e93efd13fb982c8c0

redux-sagaで非同期と戦う https://qiita.com/kuy/items/716affc808ebb3e1e8ac

reactのlazy load & suspenseを試してみた https://yuzu441.hateblo.jp/entry/2019/02/23/190000

programming.magic https://programmagick.com/blogs/ typescript とreduxに reduxに入門しながら next.jsでサンプルアプリケーションを作ってみた https://qiita.com/monzou/items/8ff07258a42042075d7b なぜNext.jsを選んだのか？DMMのサービスを支えるフロントエンド技術の今 https://logmi.jp/tech/articles/320546

[frontend4luv]

フロントエンドフレームワーク

angular.js https://study-angular-js.blogspot.com/

vue.js https://study-vue-js.blogspot.com/

react.js https://study-react-js.blogspot.com/

typescript.js https://study-typescript.blogspot.com/

[frontend4luv]

loadash,underscoreもう不要説

https://qiita.com/ossan-engineer/items/ad5313d84da82c6ac421 https://qiita.com/gcnishimura/items/a08e28def541c28458a0 https://www.okushin.co.jp/kodanuki_note/2019/01/lodash%E3%81%AEtemplate%E3%81%A8sortby%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E4%B8%A6%E3%81%B3%E6%9B%BF%E3%81%88%E3%81%A8%E5%86%8D%E5%88%A9%E7%94%A8%E3%81%AB%E5%BC%B7%E3%81%84%E3%83%9A%E3%83%BC%E3%82%B8.html

[frontend4luv]

Angularを学ぶのに便利なサイト

RX https://www.youtube.com/watch?v=2LCo926NFLI サーバーレス angularfirestoreでサーバレス https://www.youtube.com/watch?v=-GjF9pSeFTs https://angularfirebase.com/lessons/firestore-with-angularfire-basics/

[frontend4luv]

Javascriptを学ぶのに便利なサイト

A book series on JavaScript. @YDKJS

[frontend4luv]

Vueを学ぶのに便利なサイト

- vueを１００時間勉強してわかったこと https://qiita.com/kskinaba/items/3e8887d45b11f9132012

[frontend4luv]

WEBのクライント側の設計パターンを考える

- flux、Reduxは結局なにかをまとめる系https://qiita.com/syossan27/items/7e1b2e07ac68b96bdaa7

- reduxが不要なとき https://techracho.bpsinc.jp/hachi8833/2018_03_13/53183

- angular + flux design pattern https://medium.com/slido-dev-blog/angular-flux-architecture-introduction-f051a24aedfe

- fluxとdispatcherのポイント https://mae.chab.in/archives/2738 - fluxを一周する https://dev.classmethod.jp/client-side/javascript/flux-introduction-for-beginner/

[frontend4luv]

【調査】マテリアルデザイン

# Material Design

公式 https://getmdl.io/index.html

Material Designとは https://saruwakakun.com/design/gallery/material-website https://note.mu/kenichiikeuchi/n/nc697dd8ad639 https://qiita.com/nogson/items/804dd3a879f482fb7018 https://qiita.com/kazu04r/items/a90f0bb52c39e4a980ea

おすすめMaterialDesignフレームワーク10選 https://hota1024.com/2018/02/11/%E3%81%8A%E3%81%99%E3%81%99%E3%82%81materialdesign%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF10%E9%81%B8/

参考になるマテリアルデザインのWebサイト https://saruwakakun.com/design/gallery/material-website

[frontend4luv]

【調査】JS animation library

# JS animation library https://www.awwwards.com/web-animation-infographics-a-map-of-the-best-animation-libraries-for-javascript-and-css3-plus-performance-tips.html

[frontend4luv]

【調査】SVGの作成に便利なサイト

# SVGのJSライブラリ

SVG.js https://svgjs.com/docs/2.7/

snap.svg http://snapsvg.io/

[frontend4luv]

【調査】CSS frame work

# Bootstrap4

Bootstrap4に用意されているクラス https://webnetamemo.com/coding/bootstrap4/201710065870

Bootstrap4テンプレート - マテリアルデザイン https://github.com/mdbootstrap/Bootstrap-4-templates

Bootstrap勉強の関連記事 https://webnetamemo.com/category/coding/bootstrap4

Bootstrapチュートリアル https://bootstrap.hana87.club/progressbar.html

Bootstrap便利ツール https://pingendo.com/index.html https://qiita.com/TakahiRoyte/items/463ebadf04327c9115c9

popper.js https://popper.js.org/popper-documentation.html

# bulma

勉強に役立つ参考URL https://blog.nakamu.life/posts/css-bulma-url

Bulmaテンプレート、Expo、Extensions https://dansup.github.io/bulma-templates/ https://bulma.io/expo/ https://bulma.io/extensions/

Bulmaブログ（特徴紹介） https://bulma.io/blog/

Bulmaの本の目次（公式、サンプルコード、Safariでのリード） https://jgthms.com/creating-interfaces-with-bulma-ebook/ https://github.com/troymott/bulma-book-code https://learning.oreilly.com/library/view/creating-interfaces-with/9781939902498/cover.html

# Semantic UI

Semantic UIでWebサービスを作った話 https://qiita.com/Yuta_Fujiwara/items/8abeda1b92dcaf505149