ES modules と CommonJS import/export (ES modules) と require/exports (CommonJS) ES modules と CommonJS JavaScriptで、モジュールという仕組みがあります。 外部ファイルの読み込み/書き出しを行うための仕組みです。 import/exportが、モジュールの仕…

JavaScriptで関数やクラスをimportで読み込む JavaScriptで関数やクラスをexportで書きだす export default を使う JavaScriptで外部ファイルから、関数やクラスを読み込むにはimportを使います。 また、importで読み込みをできるようにするには、exportを使…

Expressでルーティング処理を行う express.Router Expressでルーティング処理を行う ExpressのWebサーバーで、ルーティング処理を行うのはとても簡単です。 次のように初期化したappのgetメソッドやpostメソッドで設定できます。 var express = require('exp…

Expressとは Expressをインストールする ExpressでHello world Expressとは Expressとは、Node.jsのWebアプリケーションフレームワークです。 RailsのNode.js版みたいなイメージです。 ルーティングやリクエストボディのパースなどもできます。 また、ミドル…

はじめに Dockerを使ってhttpサーバー on Node.jsを構築する はじめに 今回は、↓でつくったhttpサーバーをDocker環境で構築します。 utouto97.hatenablog.com 準備としては、Dockerとdocker-composeが入っている前提で進めていきます。 $ docker -v Docker v…

Dockerを使うためには、dockerコマンドを多用しますね。 $ docker ps $ docker build $ docker run $ docker logs ですが、dockerコマンドを実行するためには、権限が必要です。 毎回sudoをつけるのも大変ですし、sudoユーザーじゃないユーザーはdockerを使…

Node.jsでhttpサーバーを秒で建てる GETパラメータを処理する。 Node.jsでhttpサーバーを秒で建てる 前提として、Node.jsがインストール済みであるとします。 では、速攻でhttpサーバーを構築します。 まず、ファイルapp.jsを作成します。 $ touch app.js フ…

JavaScriptはブラウザ上で動作する JavaScriptを実行できるアプリケーションNode.js Node.jsでHello world! JavaScriptはブラウザ上で動作する JavaScriptはHTMLやCSSで記述されたWebページに動きをつけるために、ブラウザ上で実行可能な言語でした。 Chrome…

JavaScriptのasync JavaScriptのawait JavaScriptのasync JavaScriptで非同期処理を書く方法は、コールバック関数、Promise、そしてasyncがあります。 asyncは関数宣言につけることができ、asyncを付けた関数は非同期で処理されます。 async function f() { …

JavaScriptの非同期処理 非同期処理とコールバック関数 JavaScriptにはPromiseがある JavaScriptの非同期処理 JavaScriptでは、非同期処理を行うことができます。 非同期処理とは、その処理の完了を待たずにほかの処理が実行される処理のことです。 タイマー…

JavaScriptのコールバック関数と高階関数 高階関数とコールバック関数の例 コールバック関数は非同期処理で使われる setTimeoutの例 JavaScriptのコールバック関数と高階関数 JavaScriptでは、関数はオブジェクトの一種である。 そのため、関数の引数を関数…

JavaScriptの変数・定数 varとletとconstの比較 再代入と再定義 varとletとconst 巻き上げについて JavaScriptの変数・定数 JavaScriptにもほかの言語同様に変数と定数があります。 今回は、その変数と定数の宣言方法をみていきます。 変数の宣言はいくつか…

JavaScriptで関数を宣言する function を使う 無名関数 アロー関数を使う JavaScriptで関数を宣言する 関数は、引数をとり、処理を行い、値を返すものです。 イメージはこんな感じ 関数は、何かしらの処理をします。 ここでは、足し算を行う関数を考えます。…

JavaScriptのforEach forEachでインデックスも取得する JavaScriptのforEachから途中で抜ける (breakは使えるのか) JavaScriptのforEachでbreakは使えない breakの代替手段 continueについて JavaScriptのforEach JavaScriptでは、forEachを使ってループを記…

JavaScriptの繰り返し処理 JavaScriptでforを使う for (基本) for ... in ~ for ... of ~ JavaScriptでwhileを使う JavaScriptの繰り返し処理 JavaScriptでは、ほかのプログラミング言語と同様に、forとwhileを使って繰り返し処理（ループ処理）を記述できま…

git merge Fast-forward Fast-forwardではないマージ コンフリクト git merge git mergeで複数のブランチを一つにまとめることができます。 前回↓も少し使ってみました。 utouto97.hatenablog.com Fast-forward 前回のマージは以下のパターンになります。 こ…

git branch 新しいブランチを作成 ブランチでファイルを編集する ブランチを統合する git branch Gitでは，変更の履歴をつないで管理します。 その一つ一つをブランチといいます。 ブランチは途中から分岐したり、また一つになったりすることができます。 こ…

↓の続き utouto97.hatenablog.com 試してみる デフォルトタスク ネームスペース cleanタスク 試してみる デフォルトタスク task default:を設定することで、デフォルトで実行されるタスクを設定することができます。 デフォルトタスクは、rakeコマンドが引数…

Rakefile 試してみる 実行環境 シンプルなタスク 依存のあるタスク 引数をとるタスク Rakefile rubyのmakeがrakeです。 そして、ruby版のMakefileがRakefileとなります。 このRakefileには、Rubyを使ってタスクを記述し、rakeコマンドから実行することが可能…

はじめに SecureRandom uuid hex base64 Railsでidをランダムな文字列にする はじめに Railsを使っているとデータのidは、デフォルトでは整数の連番になります。 この場合、URLにパラメータとしてidを含む場合 (例えば、https://hostname/api/v1/article/123…

Rails のこと調べてたら、よくrakeコマンドなるものが使われていました。 しかも、rakeコマンド使うように書かれているところも、railsコマンドでできてしまいます。 この二つのコマンド、何なんだろうと思い調べてみました。 まず、railsコマンドですが、こ…

↓の続き utouto97.hatenablog.com 今回やること Herokuアプリを作成 Postgresの追加 アプリをデプロイする 今回やること ここまで作ってきたToDoアプリをHerokuにデプロイします。 Herokuはクレジットカードを登録すると、フリープランでずっと無料で使うこ…

Railsの練習として、ToDoアプリを作って記事にしたので、その目次を作っておきます。 ソースコード github.com アプリ https://rails-todo--app.herokuapp.com/ 目次 ① どんなToDoアプリを作るか & 環境構築 utouto97.hatenablog.com ② ToDo一覧を表示する (…

↓の続き utouto97.hatenablog.com 今回やること フィルタリング機能の追加 今回やること 今回はフィルタリング機能を追加します。 ToDoの状態 (status) によってフィルタリングします。 すべて表示、In progressのみ、Completeのみ、の3パターンを実装します…

↓の続き utouto97.hatenablog.com 今回やること 編集用フォームの準備 編集用アクションの追加 今回やること 今回は、CRUDのU (Update) として、ToDoの内容の編集を実装していきます。 あらかじめ用意していたEditボタンに機能を実装していきます。 編集用フ…

↓の続き utouto97.hatenablog.com Rails ストロングパラメータ require と permit ToDoアプリのソースコード変更 Rails ストロングパラメータ Rails には、ストロングパラメータというものがあります。 ストロングパラメータとは、安全性が検証されたパラメ…

↓の続きです。 utouto97.hatenablog.com 今回やること ルーティングの設定 コントローラーのアクション追加 ボタンの追加（ビューの編集） 今回やること 今回は、CRUD の U をやっていきます。 ただし、ToDoの編集ではなく、ToDoの状態（status）を変更でき…

↓の続きです。 utouto97.hatenablog.com 今回やること ルーティングの設定 コントローラーのアクション追加 ボタンの変更 今回やること 今回は CRUD の D (Delete) を実装していきます。 つまり、ToDoの削除ということになります。 ルーティングの設定 まず…

↓の続き utouto97.hatenablog.com 今回やること フォームの作成 ルーティングの設定 コントローラーのアクション追加 バリデーション 今回やること 今回は、CRUD の C (Create) をやっていきます。 つまり、ToDo の新規作成をできるようにします。 フォーム…

↓の続き utouto97.hatenablog.com 今回やること トップページを作成する コントローラーの作成 ルーティングの設定 ビューファイルの作成 ToDo モデルの作成 & テストデータ追加 ToDo 一覧を表示 コントローラーでデータ取得 ビューでTodo一覧表示 今回やる…