最近はJavaScriptをES6で書いたり、cssをsassで書いたりするのが当たり前になってきました。そうなると必然的に必要になるのがビルド。ビルドの仕組みも充実してきていて、単にトランスパイルするだけでなく、構文チェックしたり圧縮したり、CSSスプライトをつくるようなことまでできたりします。 で、このビルド環境、新規Project立ち上げる度に用意するのが面倒くさいので、自分用の雛形をつくりました。よかったら参考にしてみてください。 ビルドの中身 ES6 → ブラウザで動かせるJavaScriptにする scssをcssにする jsとcssはそれぞれ結合して圧縮する(.min.js/.min.cssをつくる) 変更を検知して自動ビルドする 雛形なので特別なことはしません。新しく何かつくりたいと思ったときにすぐに作れるようなビルド環境を用意するだけです。デバッグ用にトランスパイルしただ
はじめに 本編では今時のフロントエンド開発2017 (1. 愚痴編)に続き開発環境の構築をしていきます。 おしながき 今時のフロントエンド開発2017 (1. 愚痴編) 今時のフロントエンド開発2017 (2. 構築編) 今時のフロントエンド開発2017 (3. webpack編) 今時のフロントエンド開発2017 (4. TypeScript編) 今時のフロントエンド開発2017 (5. もっと効率よく編) 開発環境の構築 ナイスなエディタ コーディングをするにはエディタが必要になるわけですが,これは皆さんの信じるお好きなものを使ってください。 Atom Brackets Emacs Lime Text Sublime Text Vim Visual Studio Code なんでも良いです。 ちなみに私はVisual Studio Codeを使っています。 CLIの準備 準備と書きまし
Riot.js — A React-like user interface micro-library · Riot.js ReactやAngularJSは「でかすぎる」という問題がずっとあって、それは必要だからそうなのかもしれないけど使うプロダクトがかなり限定されるような気がする。 もう少し小さなプロジェクトもしくは、はじまりは小さくはじめたいという場合はRiot.jsやvue.jsあたりが最適なんじゃないかと言われている。 ということでRiot.jsの学習をはじめるための環境をnpm + webpackで作ってみた。 ついでなのでBabelでES2015の機能を取り入れた書き方ができるようにもしてます。 Babel · The compiler for writing next generation JavaScript サーバーとのHTTP通信などが必要になったらSuperAgent
はじめに タスクランナーを使わずにnpm+webpackのみでWebアプリを開発するためのシードプロジェクトを作成しました. フロントエンド開発のツールが多く煩雑なので,できるだけシンプルにしたいというのがモチベーションです. テストまわりは未対応で,順次追加していく予定です. [2015/9/7] 画像ファイル(png, jpg)をビルドできるようにしました. シードプロジェクトの内容 ソース https://github.com/nihsuy/webapp-seed-project プロジェクト構成 ├── src : ソースファイル │ ├── index.html │ ├── images │ │ └── logo.png │ ├── scripts │ │ └── app.js │ └── styles │ └── app.scss ├── packa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く