2018年4月25日をもちまして、 『CodeIQ』のプログラミング腕試しサービス、年収確約スカウトサービスは、 ITエンジニアのための年収確約スカウトサービス『moffers by CodeIQ』https://moffers.jp/ へ一本化いたしました。 これまで多くのITエンジニアの方に『CodeIQ』をご利用いただきまして、 改めて心より深く御礼申し上げます。 また、エンジニアのためのWebマガジン「CodeIQ MAGAZINE」は、 リクナビNEXTジャーナル( https://next.rikunabi.com/journal/ )に一部の記事の移行を予定しております。 今後は『moffers by CodeIQ』にて、 ITエンジニアの皆様のより良い転職をサポートするために、より一層努めてまいりますので、 引き続きご愛顧のほど何卒よろしくお願い申し上げます。 また、Cod
ウェブサイト制作には煩雑な処理を自動化する「タスクランナー」や「ビルドシステム」というツールがあります。この記事では、タスクランナー「Gulp.jsガルプ」の導入手順を解説します。 導入は簡単で、本記事の手順では5分程度でセットアップできます。Gulpはコマンドラインで使うのが一般的ですが苦手な人でも安心して学べるよう、ビデオでも解説します。 この記事で学べること イマドキのGulpの導入手順 Gulp 5に対応した書き方 Sassサスの導入手順 GulpやSassの導入や使い方にはいろんな方法がありますが、この記事では現場で使われている方法を紹介します。Gulpの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。本記事は最新版に対応させているので、安心して読み進めてください。 ※この記事では、Node.js v18〜v20で動作検証をしています。 ※Gulp
WP-CLIとWordPress公式ディレクトリを活用した爆速サイト構築術 ーインストールからデザイン、ページ作成までを10分でー
背景 Javascript で Web アプリを作ろうとすると、よくわからないことだらけで超混乱します。 npm と bower の違いは？ npm はサーバーサイド用、bower はクライアントサイド用らしいよ えっ、でもなんで bower のインストールに npm が必要なの？ サーバーサイドは Rails で書きたいから npm 要らないと思うんだけど・・・ ていうかサーバーサイドJSとか node.js って何？ よく見る browserify って何？ こういった疑問が沸き上がるのは、各ツールが生まれた文脈がよくわかっていないからです。いろいろ調べてやっとちょっとわかってきたのでメモします。間違いがあったらご指摘ください。 「CommonJS」誕生 - Javascript は汎用プログラミング言語へ その昔、Javascript 大好きおじさんは言いました。 Javascrip
PostCSSというnode.js製のツールがある。 PostCSSのGitHubでのStar数は4000を超え、海外のブログではPostCSSについての記事をよく目にするようになった。しかしまだ日本では盛り上がりを感じていないので、日本語のPostCSSの記事を書くことにした。 PostCSS PostCSSとは、JavaScriptで書いたプラグインでCSSを変換するためのツールだ。 PostCSS自体は、CSSパーサーとそのASTを操作するためのAPIのみを提供していて、ユーザーはPostCSSのプラグインを書くことでCSSを変換することができる。 僕もPostCSSを使って、以前ブログにも書いたAtCSSというCSSプリプロセッサーや、postcss-style-guideというスタイルガイドをMarkdownから自動生成するためのプラグインなどを書いたことがある。 PostCSS
はじめに 少し間が空いてしまいましたが、今回はクラウド上のIDE（統合開発環境）であるCloud9 IDEを使って、Node.jsアプリケーションの開発を行う方法について紹介します。前回紹介したHerokuとの連携機能およびGitを用いて、Cloud9 IDEとソースコードを相互にやり取りする方法を説明します。 Cloud9 IDEでは、統合開発環境では基本的なコード補完やシンタックスチェック、Git、Mercurialのバージョン管理ツールの利用だけでなく、SSH、FTPなどのCUIによる操作もサポートからチームによるチャットなどを使った共同での開発作業と、幅広く多機能な環境をブラウザから利用することができます。 Cloud9 IDEにサインアップ まず、Cloud9 IDEのサイトから、［Sign up］ボタンよりアカウントを登録しましょう。GitHubまたはBitbucketのアカ
Run JavaScript EverywhereNode.js® is a free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts.
No matter your role, or your automation goals, Ansible can help you connect teams and deliver efficiencies. Ansible is an open source IT automation engine that automates provisioning, configuration management, application deployment, orchestration, and many other IT processes. It is free to use, and the project benefits from the experience and intelligence of its thousands of contributors. Red Hat
こんにちは！スタッフのめぐみです。 今回は私が Web 制作の際に使用している gulp というビルドシステムの紹介をしたいと思います。 タイトルの通り gulp を試してみよう！ということで、用意したサンプルを使って実際に手を動かしながら記事を読み進めてみてください。 ※ この記事では sass (ver 3.1 以上)がすでにインストールされているものとして話を進めますので、ご留意下さい。 gulp とは gulp は Node.js をベースにした、 Sass のコンパイルや js ファイルの結合・圧縮などを自動化してくれるビルドシステム(ツール)です。同じようなものに Grunt があり、タスクの記述の仕方が違いますができることはほとんど同じです。gulp の場合、必要なタスクはgulpfile.jsに記述します。 ちなみに、 Node.js についての説明は割愛します。以下の記事
Time-saving synchronised browser testing. It’s wicked-fast and totally free. npm install -g browser-sync Get Started Your indispensable test assistant. With each web page, device and browser, testing time grows exponentially. From live reloads to URL pushing, form replication to click mirroring, Browsersync cuts out repetitive manual tasks. It’s like an extra pair of hands. Customise an array of s
2014/9/12に行われた週末ランサーズでのGulpハンズオンで使用したスライドです。 LIGブログでこの内容をさらにまとめています。 http://liginc.co.jp/web/tutorial/117900
This is a book about JavaScript, programming, and the wonders of the digital. You can read it online here, or buy your own paperback copy. Written by Marijn Haverbeke. Licensed under a Creative Commons attribution-noncommercial license. All code in this book may also be considered licensed under an MIT license. Illustrations by various artists: Cover by Péchane Sumi-e. Chapter illustrations by Mad
シングルページWebアプリケーション ―Node.js、MongoDBを活用したJavaScript SPA シングルページWebアプリケーション（SPA）は、最近注目を集めているWebアプリケーションのアーキテクチャです。SPAは、ユーザがアプリケーションを使っている間、Webページ全体をロードすることがなく、レスポンスが高速でUI/UXに優れているという利点を持っています。かつてはJavaアプレットやFlashといったWebブラウザのプラグインに依存する必要がありましたが、近年ではJavaScriptを使ったSPAが現実的になってきています。JavaScriptベースのため、既存のWeb開発スキルの活用が容易であり、新しいデバイスへの対応も比較的簡単です。本書では、クライアントでJavaScriptを使ったSPAを採用するだけでなく、WebサーバにNode.js、データベースにMong
タスクランナーgulp入門 gulpはGruntと同じように様々なタスクを自動化してくれるツール(タスクランナー)です。 node.jsで開発されており、Sass/CompassやLess、StylusなどのCSSプリプロセッサーのコンパイルやCSS/JSの結合圧縮、JSHintによるバリデーションなど様々なタスクを自動で行ってくれます。 Gruntとできることはほとんど同じですが、Gruntよりタスクの流れがわかりやすく、JavaScript(node.js)で独自のタスクも簡単に記述することができます。 後発ということもありGruntよりプラグイン数は少ないですが、マニアックなタスク以外はそろっているので通常のWeb制作などでは問題なく利用できるでしょう。 node.jsのインストール node.jsが必要ですのでインストールしていない方はインストールしましょう。 公式サイトでインスト
連載目次 一昔前であれば、HTML／JavaScript／CSSを使用してWebアプリを作成する場合、（筆者の経験では）所定の位置にファイルを置くだけでした。最近はHTML／JavaScript／CSS関連の技術も複雑化／多様化し、いろいろなことを考慮しなければなりません。 例えばJavaScriptファイルの場合は、以下の作業を行うこともあるでしょう。 minify（圧縮）や結合 単体テストの実行 JSLint（構文チェック）の実行 さらに、CoffeeScriptやTypeScriptを使用している場合にはコンパイル（JavaScript変換）を行う必要もあります。 また、SCSS（Sass）やLESSなどのCSS拡張メタ言語を使用している場合にも、コンパイル（CSS変換）作業が必要です。 ファイルを修正してビルドするたびに、これらの作業をいちいち手作業で行っていては非常に面倒でしょう
CSSは非常に簡単な言語だ。セレクタとプロパティと値を宣言するだけである。だが、スパゲッティなコードにならずにメンテナンスしやすく、スケーラブルなCSSを書くことは非常に難しい。 そのため、あなたの書くスタイルシートは時とともに重く、汚いものになっていき、手の施しようがなくなる。そうなると、今度はそれを読み込むWebサイト・アプリに害をもたらすことになってしまう。 そう、Critical Rendering Pathの問題だ。レンダリングをブロックするのはなにもJavaScriptだけではない。CSSもレンダリングをブロックするので、我々はCSSに関しても細心の注意を払わなければならない。 しかし、CSSを書く人にその意識があるのだろうか、疑問だ。前述のとおり、CSSをただ書くこと自体は簡単なため、CSSという言語自体も軽んじられている気がする。 CSSを書くためには自分を厳しく律しなけれ
スタイルシートの統計情報を出力するNode Packageを作った。 t32k/stylestats Node.js 0.10以上が必要で、CLIだとこんな感じの情報を出力してくれる。 $ npm install -g stylestats $ stylestats path/to/stylesheet.css StyleStats! ┌────────────────────────┬──────────┐ │Size │ 498.0B │ ├────────────────────────┼──────────┤ │Rules │ 7 │ ├────────────────────────┼──────────┤ │Selectors │ 11 │ ├────────────────────────┼──────────┤ │Simplicity │ 63.64% │ ├───────
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
