progate
今回の目標：一覧画面と閲覧画面の両方でログイン状態を確認できるように変える。（ログイン状態の確認をリクエストの度に毎回実行できるようにする） 常にログイン状態を確認しよう app.use関数を使うとどうなるの？ 常にログイン状態を確認することができ…
セッションを管理しよう セッション管理ってなんだっけ？？ アクセスユーザの管理をすること 参考 www.f5.com www.atmarkit.co.jp e-words.jp セッション管理とは ・クライアントの状態をサーバーが管理する状態を指す ・セッション管理にはSID（セッションI…
ユーザー認証の処理を作ろう（２） 目的：ユーザー認証システムを構築する このように覚える ユーザー認証とは ユーザー認証 ＝ 本人確認のこと メールアドレス パスワード ＝これらの認証を得ることで「本人確認がとれた」と意味する このように覚える ユー…
ユーザー認証の処理を作ろう（１） 今回の目標 ：フォーム送信 ：一覧画面表示 ログイン処理をするルーティングを用意しよう ：ユーザー認証の処理をする ：ログイン処理を作るルーティングを用意する こう覚える。 手順１ Ex. <form action="/login" method="POST"> このように書く。 手順２. <p></p></form>…
ログイン機能を作ろう 目標：ブログサイトにログイン画面を作る ログイン機能の作成手順 ・ログイン画面を作る ・ユーザー認証画面を作る ・セッション管理の準備をする このように覚える ログイン画面を作成しよう 今回の目標：ログイン画面の作成・表示 こ…
ブログサイトの現状を確認しよう 確認すること ：Node.js ：MySQL 上記を使ったブログサイト構築を実施している（する）前提で開始。 ブログサイトの構成を確認しよう 画面構成を確認する：３つの画面によって構成している 各画面のビューファイル 一覧画面 …
ブログサイトを作り始める 確認 ：Node.js学習コースI~III を振り返り学習する ：スムーズにサイト作りできるように復習 これから作りたいもの 目標：ログイン機能実装されたブログサイトを構築する このレッスンで学ぶこと 工程表確認 ① ログイン機能を作ろ…
より硬度なWebアプリケーションを作る準備をしよう ちんぷんかんぷんでしたとりあえず音読し、録音しました。１００回ほど聞き直しチャレンジしてみます。参考：HTTP の基本方針https://t.co/01tqjgHN0nより高度なWebアプリケーションを作る準備をしよう！を…
エラーの例 課題 更新機能での不具合をデバックする どんな問題なのかを把握するため、問題を可視化する。 演習問題 エラー内容 「ブラウザ中の編集ボタンを押すと、メモの内容が消えてしまう。」 つまり、更新機能の不具合によるエラーがでていた と考えら…
エラーを可視化しよう 結論：要は慣れです このように覚える エラーの例 point -- 作成機能に原因がある 理由を逆算して考えてみる。 このように考える 演習問題 point -- 作成機能に関するコードを確認する エラー出力させ、具体的にどこに問題があるのかを…
デバッグに慣れようぜ ヒントはエラーメッセージに書いてある。 そこから紐解くカギがある。 エラーの例 アクセスできませんでした。 -- このような時の対処方法はどのようなものかを演習問題にて確認する 演習問題 ブラウザ上のエラー確認 注目：１行目にエ…
デバッグとは ：'バグを修正する'という意味 ：意図したコードが動かないことを修正すること このように覚える。 なぜデバッグの練習をするのか ：サポートなしで一人でプログラミングできるようになるため。 このように覚える。 デバッグの手順 エラーの内…
更新処理の流れを確認しよう 目的：フォーム送信と一覧画面をつくる 流れを理解する： 更新用のルーティング作成 編集用フォームから値を送信 更新用フォームの完成 このように覚える。 更新に必要な情報を確認しよう UPDEATEクエリを覚える point フォーム…
メモの内容を表示する流れを確認しよう point 前選択されたメモの内容を、フォームに表れている状態になっていない。 この状態を改善する。 app.postメソッド・formメソッドを駆使し、メモの編集画面を完成させよう。 メモを取得しよう 取得コードは以下の通…
受け取ったidをクエリに使おう 受け取ったけとったIDからDELETEクエリを実行させる受け取ったけとったIDからDE目的：受け取ったidを使って指定されたメモを削除を求められた時、処理する流れを理解する メモを削除しよう 演習問題削除機能の実装までの流れ …
今回覚えること ・/deleteから/delete/:idへ変更する概念を学ぶ ・ルーティング処理/delete/:idを使い、ルートパラメータからの出力（console.log)表示させる ・ルートパラメータを使って'指定されたidプロパティ値を追加'する メモ削除の処理を作ろう 目的 …
目標 ：削除ボタン（フォーム送信）を作る ：（削除後の）一覧表示された画面を作る 削除機能の手順を確認しよう 削除フォーム送信される→Node.jsを介して削除実行される→削除後の一覧画面が表示される このように覚える。 削除後のリダイレクト機能もあるの…
今回の目的 ：EJSを自らインストールする。 EJSを使って値を表示しよう HTMLとJavaScriptのコード両方を記述できるNode.jsのパッケージHTMLとJavaScriptの EJSとは HTMLコードの中にJavascriptを埋め込むことができる 埋め込むことを Enbedded 英訳する。 頭…
一覧画面を作ろう 目標作成物：買い物メモ一覧画面を作っていく 一覧画面を表示させよう 目的：指定localhostのアクセス時、一覧画面表示させる手順を覚える app.get('/index' ,(req, res) => { res.render('index.ejs');}); ２つのプロセスを完成させる 上…
今回の目的：「買い物メモサービス」のトップ画面を整えること。 CSSを適用しよう publicフォルダの中にcssファイルを作成します。CSSを適用したい場合は、 EJSファイルでpublicフォルダ内のパスを指定します。 CSSを適用するには（1） 新規指定フォルダを作…
Node.jsでWebアプリケーションを作ろう 「ルーティング」とは URLに対応する処理を実行すること このように覚える。 URLに対応する処理を実行すること とは？ /topにリクエストが来た時に、トップ画面を表示すること このように覚える。 app.get( 'top' ,() …
データベースの作成方法 SHOW databases;SHOW databases;SHOW databases; SHOW databases; database一覧が表示される データベースの作成方法 CREATE DATABASE 指定データベース名 この様に書く 「SHOW databases」にて確認。一覧に表示されていたら成功。 …
総復習 コマンドの履歴 ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ コマンドの履歴をみる時は ↑（矢印うえボタン）を押すと過去の履歴を表示できる このように覚える 演習問題 確認しよう mkdir : フォルダ作成 mkdir/指定ディレクトリ名…
ファイルの駆除 ｒｍ削除するファイル名 ｒｍ削除するファイル名ｒｍ削除するファイル名ｒｍ削除するファイル名 ファイルの削除 rm 指定ファイル名 このように書く ディレクトリ（フォルダ）の削除 ｒｍ -r 削除するファイル名ｒｍ -r 削除するファイル名 ｒ…
ファイルのコピー cp コピーするファイル名 新しいファイル名cp コピーするファイル名 新しいファイル名cp コピ 移動 名前変更✓コピー 削除 cp コピーしたいファイル名 新しいファイル名 このように書く ディレクトリのコピー cp -r コピーするディレクトリ…
ファイル名を変更する デmv ファイル名 新しいファイル名mv ファイル名 新しいファイル名mv ファイル名 新しいファイル名 移動✓名前変更 コピー 削除 --- 「mv 今のファイル名 新しいファイル名」 このように書く 演習問題 ※右側の仕様書は言葉足らずなので…
ファイル・ディレクトリを移動させる mv ファイル名 ディレクトリ名mv ファイル名 ディレクトリ名mv ファイル名 ディレクトリ名mv ファイ ✓移動名前変更コピー削除 ✓移動させるには 「mv ファイル名 指定したディレクトリ名」 このように書く mv 移動させた…
ディレクトリを 指定しないcdコマンド ホームディレクトリへ移動せよホームディレクトリへ移動せよホームディレクトリへ移動せよ これを覚える 「~」この表示が表示されたら「ホームディレクトリ」へ移動した と認識すること ホームディレクトリへ移動する方…
1つ親のディレクトリ 「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」「cd ..」 今までは 「ｃｄ + 指定ディレクトリ」にて移動できた。 しかし、１つ前の親への移動は 「cd ..」を使用する こう覚え…
ディレクトリの中身を 表示する ls（エルエス）コマンドls（エルエス）コマンドls（エルエス）コマンドls（エルエス）コマンドls Is と書くと、「ディレクトリの中身を表示」することができる こう覚える ls（エルエス）で表示される範囲 ls（エルエス）コマ…
