クモのようにコツコツと

Webデザイナー イイダリョウのブログ。略称「クモコツ」

黒い画面だけでWebページを作成-後編:viエディタでコーディング!

「前編」の続きです。前編ではフォルダ作成(mkdir)、ファイル作成(touch)・複製(cp)・移動(mv)・削除(rm)を行いました。後編ではいよいよテキストエディタを使わず、黒い画面だけでコーディングを行います。ターミナルの中に内蔵されているviエデ…

黒い画面だけでWebページを作成する - 前編:ファイル、フォルダの作成

「初めての黒い画面」以降、ちょいちょい黒い画面(ターミナル)に触れてきましてだんだんと慣れてきています。ここらで新たな試みをしてみます。そう、私は感じたのです。もしかしてだけど、もしかしてだけど、黒い画面だけで、テキストエディタ使わずにWeb…

初めてのNode.js:インストール確認、REPL、Hello worldまで

JS

「黒い画面」叩いて初体験シリーズ!前々回「Python」、前回「Ruby」に続きまして、今回は「Node.js」にトライ。いや〜Node.js。サーバサイドJSですよ、ハイ。これも前々から気になっておりましたよ。でもどうやって初めたらいいのかわからなかった。黒い画…

初めてのRuby:インストール確認、REPL、Hello worldまで

前回、データ分析をしたくなってPythonに挑戦しました。同時にこれまで苦手だった「黒い画面」(ターミナル)にも触れることができました。そしたらなんと、これまでよくわからなかった黒い画面系の記事がなんとなくわかるようになってきました。「サーバサ…

初めてのPython(インストール〜Hello world)と初めての黒い画面

このところ、データサイエンティストによるデータ分析記事が様々な切り口で興味深々です。どうやら皆さんPythonでプログラミングをしているようです。私もやってみたくなってきました。そこで、PythonのインストールからHello worldまでやってみました。なお…

【Googleアナリティクス】ユーザー分析の基本(ユーザー、セッション、PV)

Webサイトは作って終わりじゃない!作ったあとの分析も大事。アクセス解析=Googleアナリティクス(GA)といっても過言ではない必須ツールですが、最初は膨大な数字の山に戸惑いますよね。 今回はWebサイトの目的、GAの導入、そして大事な3つの数字「ユーザ…

Chromeデベロッパーツール事始め!HTML、CSS、JSを直感的に修正しよう

Webサイト制作で欠かせないChrome「デベロッパーツール」 。でも、なんだか英語メニューがたくさんで、一体どこをどう触ればいいの? まずはHTML、CSS、JSのリアルタイム修正から入るのがおすすめ。ブラウザ上で直接修正が反映されて、大変直感的ですよ!

デザインも配色も「メリハリ」が9割!基本を身につける学習方法

タイトルの「9割」は言い過ぎかもしれないが、「メリハリ」はとても大事な考え方と思っています。ポイントは「主役」と「脇役」をハッキリさせることです。美術系の学校を出ていない文系雑草独学デザイナーの私が試行錯誤しながら身につけた学習方法をご紹介…

【Vue.js】axiosでJSONファイルを読み込む(酒が飲めるぞ!編)

JS

Vue.jsシリーズの続きです。前回、Vue.jsのイベント、分岐、ループをやってみました。その中のループ(v-for)で外部JSONファイルを読み込めそうなので、ロジックとデータを分離してみましょう。チュートリアルを見ると「axios」という方法を推奨しているよ…

HTMLテンプレートエンジン、AltCSS、AltJSの総まとめ(3記事)

あるとイイね!なフロント代替言語「HTMLテンプレートエンジン」「AltCSS」「AltJS」。少ない記述量のコードで済みます。ただし、残念ながらそのままではブラウザに表示されません。HTML、CSS、JSに変換(コンパイル)するための開発環境が必要です。そこで…