QRオーダーシステムの構築
[15 | 飲食店 表示] ホーム] >> [17 | react-dropzone]ランキング参加中プログラミング「src/apis.js」ファイルに関数を追加します。 記述追加 【Desktop/QRMenu/qrmenu_react/src/apis.js】 import { toast } from 'react-toastify'; function request(path…
[14 | 飲食店登録実装] ホーム] >> [16 | 画像アップロード]ランキング参加中プログラミングVisual Studio Codeで「qrmenu_react」側を編集します。 「src/apis.js」ファイルに記述を追加します。 記述追加 【QRMenu/qrmenu_react/src/apis.js】62〜64行目 i…
[13 | ユーザー登録] ホーム] >> [15 | 飲食店 表示]ランキング参加中プログラミングDjango側(qrmenu_server)の実装を行います。 Visual Studio Codeで「qrmenu_server」を開きます。 「qrmenucore」フォルダの「models.py」ファイルを開きます。 models.p…
[12 | Auth Context] ホーム] >> [14 | 飲食店登録実装]ランキング参加中プログラミング「qrmenu_react/src/apis.js」ファイルを編集します。 記述編集 【QRMenu/qrmenu_react/src/apis.js】 import { toast } from 'react-toastify'; function request(path…
[11 | ログイン機能実装] ホーム] >> [13 | ユーザー登録]ランキング参加中プログラミング「qrmenu_react/src」フォルダの中に「contexts」フォルダを新規作成します。 新規作成した「contexts」フォルダの中に「AuthContext.js」ファイルを新規作成します。…
[10 | ログイン機能実装前準備] ホーム] >> [12 | Auth Context]ランキング参加中プログラミングまずは「qrmenu_react」の編集をします。 「qrmenu_react/src/pages/Login.js」ファイルを以下のように編集します。 記述編集 【Desktop/QRMenu/qrmenu_react/s…
[09 | React-Toastify] ホーム] >> [11 | ログイン機能実装]ランキング参加中プログラミング以降の作業は、Visual Studio Codeを2つ起動し、ウィンドウ2つを移動しながら作業する必要があります。 まず一つ目のウィンドウを開いたら、デスクトップにある「…
[08 | React-Bootstrap] ホーム] >> [10 | ログイン機能実装前準備] ランキング参加中プログラミングReact-Toastifyをインストールします。 コマンド npm i react-toastify@7.0.3 -s 「src/index.js」ファイルに記述を追加します。 記述追加 【QRMenu/qrmenu…
[07 | React] ホーム] >> [09 | React-Toastify]ランキング参加中プログラミング「React Bootstrap」と「Bootstrap」を追加します。 コマンド npm i react-bootstrap@1.5.2 bootstrap@4.6.0 -s 「index.js」ファイルにBootstrapをインポートする記述を追加し…
[06 | GitHub] ホーム] >> [08 | React-Bootstrap]ランキング参加中プログラミングReactの設定を行います。 ターミナルを開き、デスクトップにある「QRMenu」フォルダに移動します。 コマンド cd ~/Desktop/QRMenu フォルダの移動 npmを使ってReactのアプリ…
[05 | djoser] ホーム] >> [07 | React]ランキング参加中プログラミングGitHubにアプリケーションをコミットします。 バージョン確認ファイルを作成します。 pip3 freeze > requirements.txt 作成された「requirements.txt」 asgiref==3.7.2 certifi==2023.5…
[04 | アプリケーションの作成] ホーム] >> [06 | GitHub]ランキング参加中プログラミングdjoserを使ってユーザー認証や登録などの認証周りを実装していきます。 コマンド pip3 install djoser==2.1.0 djoser 「settings.py」ファイルに記述を追加します。 …
[03 | postgresqlの設定と管理ダッシュボード] ホーム] >> [05 | djoser]ランキング参加中プログラミングVisual Studio Codeを起動し、ターミナルを起動します。 仮想フォルダをアクティベートします。 コマンド source ~/Desktop/venvqrmenu/bin/activate …
[02 | Djangoのインストールとプロジェクト作成] ホーム] >> [04 | アプリケーションの作成]ランキング参加中プログラミングまずVisual Studio Codeを起動し、エクスプローラをクリックします。 エクスプローラー デスクトップにある「QRMenu」フォルダの「q…
[01 | 開発環境の構築] ホーム] >> [03 | postgresqlの設定と管理ダッシュボード]ランキング参加中プログラミング Djangoでプロジェクトを作成していきます。 ターミナルでデスクトップに移動します。 コマンド cd Desktop cd Desktop venv( virtualenv)を使…
[ホーム] >> [02 | Djangoのインストールとプロジェクト作成]ランキング参加中プログラミングまずは開発のための環境を構築していきます。 Homebrewのインストール Homebrewとは、Mac上でソフトウェアのインストールやアンインストールを管理してくれるシス…