Node.jsとそのフレームワークExpressを習得するためにやったことをここにまとめていきます。(随時更新!)
※GitHub PagesからHerokuのPostgreSQLにCRUD!CORS設定も!(2020/11/15追加)
Node.js
Node.jsをインストールしてHelloWorldしてみる。Node.jsはフロントエンド開発環境として重要。
※参考:初めてのNode.js:インストール確認、REPL、Hello worldまで
Node.jsでWebサーバ立ててHTTP通信(2020/02/21追加)
※参考:【Node.js】Webサーバを立ててハローワールドを表示する
ハローワールドを色々打ち替える(2020/03/02追加)
※参考:【Node.js】ハローワールドの打ち替え(ポート番号、日本語化、HTMLタグ化)
fsモジュールでHTMLファイルを読み込んで表示(2020/03/12追加)
※参考:【Node.js】fsモジュールでHTMLファイルを表示する
ルーティング設定でCSS、JSファイルを読み込み(2020/03/30追加)
※参考:【Node.js】ルーティング設定でCSS、JSファイルを読み込む
ルーティングで複数ページを表示(2020/04/03追加)
※参考:【Node.js】ルーティング設定で複数ページを表示する
Express事始め
まず、Expressとはなんなのか。JSフレームワークとの役割の違い。
※参考:ExpressとJSフレームワーク(React、Vue、Angularなど)との関係について調べたこと
Expressをインストールしてハロワ(Hello World)(2020/04/10追加!)
※参考:Express事始め(インストール〜ハローワールドまで)
res.sendFile()、express.static()による静的HTMLファイルの表示(2020/04/16追加)
※参考:【Express】静的HTMLファイルの表示(res.sendFile()、express.static())
ExpressでAPI
ExpressからMySQL、MongoDBに接続する(2020/08/16追加)
※参考:【Epxress】データベース接続の比較(MySQLとMongoDB)
Fetch APIのデータをbody-parserで受け取ってテキストを返す(2020/08/30追加)
※参考:【Express】body-parserでFetch API(およびForm)のPOST送信を受け取る
MySQLのデータをbody-parserでブラウザに返す(2020/09/03追加)
※参考:【Express】MySQLのデータをbody-parserでブラウザに返す
ExpressでFetch APiとMySQLを連携しCRUDする(2020/09/14追加)
※参考:【Express】Fetch APIとMySQLを連携してフォームからデータベースにCRUDする
ExpressとHerokuの連携
Node.js環境をHeroku CLIを使ってHerokuにデプロイ(2020/09/22追加)
※参考:【Express】Heroku CLIを使ってNode.js環境をHeroku上にデプロイする
環境変数とかPATHを通すとかフワッとしてた部分を調べる(2020/09/26追加)
※参考:【Express】環境変数とは?PATHを通すとは?けっきょく南極ローカルインストール!(Herokuコマンドでローカル起動)
heroku configでローカルの.envファイルとクラウドの環境変数を同期(2020/09/30追加)
※参考:【Express】heroku configでHerokuに環境変数を設定(.envファイルとHerokuの同期)
Fetch APIでHerokuの環境変数を読み込んでブラウザに表示する(2020/10/02追加)
※参考:【Express】Fetch APIでHerokuの環境変数を読み込んでブラウザに表示する
HerokuとGitHubを連携して自動デプロイ!環境変数はソースに含めずに成功(2020/10/08追加)
※参考:【Express】HerokuとGitHubを連携して自動デプロイ(環境変数は除外)
ExpressとPostgreSQLの連携
ExpressとPostgreSQLの連携、DB接続情報はGitHubから除外(2020/10/27追加)
※参考:【Express】HerokuのPostgreSQLのデータを表示する
Fetch APIでExpressのAPIを叩いてPostgreSQLのデータを表示(2020/10/30追加)
※参考:【Express】Fetch APIでAPIを叩いてHerokuのPostgreSQLのデータを表示する
フォームとPostgreSQLを連携したCRUDの前編、テーブルやモジュールの追加(2020/11/05追加)
※参考:【Express】body-parserでフォームからHerokuのPostgreSQLにCRUD(前編)
フォームとPostgreSQLを連携したCRUDの後編、CRUD操作。新たな課題も(2020/11/06追加)
※参考:【Express】body-parserでフォームからHerokuのPostgreSQLにCRUD(後編)
GitHub PagesからHerokuのPostgreSQLにCRUD!CORS設定も!(2020/11/15追加!)
※参考:【Express】GitHub PagesからHerokuのPostgreSQLへCRUD操作(CORSエラー対策も)
随時更新していきます!