ブックマーク / creator.aainc.co.jp (3)

  • gulp入門その1―とりあえず動かすところまで

    こんにちは、フロントエンドエンジニアのあつこです(ΦωΦ) 去年の11月辺りから、メインマシンがWinからMacに変わりました。 Winちゃんもサブマシンとして頑張ってくれています。主に検証に使用していますが、、、 メインマシンの交代を機にgulpを導入したので、方法やら所感やらをちょこちょことまとめていきます。 今回は、簡単なタスクを登録して動かすところまで。 その2で、ファイルの監視や同期処理などを覗いていきたいと思います。 もくじ タスクランナーってなに? Gruntとgulp 必要なものを準備する タスクを書いて、実行しよう まとめ タスクランナーってなに? メインマシンがOSごと変わったので、自分の開発環境を整理・再整備する際に (´-).。oO(いっちょ最近流行りのタスクランナーでも入れてみようかね…) と思い立った次第です。 大学時代のトラウマから黒い画面はあまり好きではない

    gulp入門その1―とりあえず動かすところまで
  • gulp入門その3―こまごま便利なこと

    こんにちは、フロントエンドエンジニアのあつこです(ΦωΦ) まさかgulpネタをこんなに引っ張ることになるとは思わず、アイキャッチは使いまわしです。 今回は、細かい便利な機能をgulpに乗せてみましょう。 今までの記事はこちら gulp入門その1―とりあえず動かすところまで gulp入門その2―ファイルの監視をしてみる もくじ 同期処理をする ローカルサーバを立ててライブリロードする CSSのminifyしたりプロパティを並び替えたりする package.jsonでモジュールを管理する まとめ ※今回は手順にプラグインのインストールを含めません。 インストール方法は前回・前々回の記事を参照にしてください。 同期処理をする 初回からさんざん書く書く言っていた同期処理です。 そもそもgulpは非同期処理なのでタスクの完了が早いわけですが、どうしても同期的に処理したい場合もあります。 そこでru

    gulp入門その3―こまごま便利なこと
  • cssの設計を考えるにあたり参考にした設計思想

    こんにちは、てっちゃんです。 みなさんはお花見しましたか?今年は安定した暖かさで例年よりもすごしやすかったなと思いました。 そして、私事ですがこの春から花粉症デビューになりそうというお話をいただきまして、毎日マスクが手放せません。いやー、のどのイガイガがたまらなく嫌ですね。 今回は、cssの設計について調べたことを書いていこうと思います。 弊社でもフロントエンド陣によりある程度のコーディングガイドラインは決まっていますが、 記述の細かい仕様までには及んでいません。コンポーネントの作り方なども人によって差異が出てきます。 複数人で作業とも慣れば尚更その差異は大きくなります。cssは記述自体はとても簡単でそれゆえに、とてももろくすぐに壊れてしまいます。 参考:なんでCSSすぐ死んでしまうん そこで壊れにくcssを設計するためには以下が重要だと言われています。 拡張性 保守性 明瞭性 参考:CS

    cssの設計を考えるにあたり参考にした設計思想
  • 1