React NativeとDjango REST Frameworkでスマホアプリを開発していきます。
はじめてReact Nativeをさわる方向けのチュートリアルになります。
Djangoと連携させて簡単なブログアプリを開発していきましょう。
React Nativeの状態管理はReduxを使用して、スタイルはTailwindCSSを使用します。
ExpoというReact Nativeのアプリ開発をサポートするフレームワークを使用しています。

スマホアプリが開発できるようになると、一気にアイデアの幅が広がります。
ぜひ参考にしてください。

超級

はじめてのReact Nativeスマホアプリ開発

DRF/ReactNative

はる@講師

DjangoでTailwindCSSを使用する方法を紹介します。
TailwindCSSをCDNから読み込むと、すべてのクラスが読み込まれるので、とても重くなってしまいます。
この方法を実行すると、軽量化したTailwindCSSを読み込むことができるようになります。
ぜひ参考にしてください。

初級

TailwindCSSを使用する方法

Django

DjangoをGitHub Actionsを使用して、VPS(Vultr)に自動デプロイする方法を紹介します。
VPSにデプロイする際は、毎回ssh接続して操作をする必要がありますが、GitHub Actionsを使用すると、自動でデプロイできるようになるので、かなり楽になります。
ぜひGitHub Actionsを使いこなしてみて下さい。

上級

GitHub ActionsからVPSに自動デプロイ

Django REST FrameworkとNext.jsでインスタ風の画像投稿サイトを構築していきます。
バックエンドはDjango、フロントエンドはNext.jsとTailwindCSSを使用し、状態管理は Redux を使用します。
SSG(Static Site Generation) + ISR(Incremental Static Regeneration) の仕組みを採用して、画像の投稿、編集、削除の構築方法を学習していきます。
本チュートリアルはサブスク有料会員サイト構築のアカウント認証編が完了したプロジェクトを使用していきます。
インスタのような画像投稿サイトを作ってみましょう。

インスタ風画像投稿サイト構築

DRF/Next.js

フルスタックチャンネルをご利用頂きありがとうございます。

新しい講座のお知らせです。

はじめてのReact NativeとDjango REST Frameworkスマホアプリ開発
https://www.fullstackchannel.com/courses/20

React NativeとDjango REST Frameworkでスマホアプリを開発していきます。
はじめてReact Nativeをさわる方向けのチュートリアルになります。
Djangoと連携させて簡単なブログアプリを開発していきましょう。

スマホアプリが開発できるようになると、一気にアイデアの幅が広がります。

ぜひ参考にしてください。

よろしくお願いいたします。

🦀新しい講座のお知らせ

フルスタックチャンネルをご利用頂きありがとうございます。

新しい講座のお知らせです。

✅DjangoでTailwindCSSを使用する方法
https://www.fullstackchannel.com/courses/19

TailwindCSSをCDNから読み込むと、すべてのクラスが読み込まれるので、とても重くなってしまいます。
この方法を実行すると、軽量化したTailwindCSSを読み込むことができるようになります。

ぜひ参考にしてください。

よろしくお願いいたします。

🐔新しい講座のお知らせ

フルスタックチャンネルをご利用頂きありがとうございます。

新しい講座のお知らせです。

✅DjangoをGitHub Actionsを使用して、VPS(Vultr)に自動デプロイする方法

https://www.fullstackchannel.com/courses/18

VPSにデプロイする際は、毎回ssh接続して操作をする必要がありますが、
GitHub Actionsを使用すると、自動でデプロイできるようになるので、かなり楽になります。

ぜひGitHub Actionsを使いこなしてみて下さい。

よろしくお願いいたします。

🐱新しい講座のお知らせ

フルスタックチャンネルをご利用頂きありがとうございます。

🔶アップデート情報です。
・サイト内(ベル)通知機能改善
　投稿した質問に回答があった場合に、サイト内通知されます。

　✅サイト内通知内容
　・運営からのお知らせ
　・自分の質問

・質問の回答改善
　質問の回答を編集できるようにしました。
　返信にもマークダウン形式を利用できるようにしました。

改善してほしい点や、新規機能追加などありましたら、ぜひお問い合わせにてご連絡ください
https://www.fullstackchannel.com/contact

よろしくお願いいたします。

🌻アップデート情報

### 実現したいこと
Next Authを使ってのGoogle認証を実現したい。

### 発生している問題
フルスタックチャンネルの『Django REST Framework + Next.js + NextAuth Google認証』を見ながらNext AuthのGoogle認証を実装したのですが、ログイン画面からログインを試すとエラー画面になります。コンソールにはCALLBACK_OAUTH_ERRORと表示されます。



一人で解決するには時間が掛かりそうです。はる先生、どうかお力添えお願い致します。

### ソースコード
**[...nextauth].js**



```import NextAuth from 'next-auth'
import GoogleProvider from "next-auth/providers/google"
import LineProvider from "next-auth/providers/line";

import axios from 'axios'


const settings = {
    providers: [
        GoogleProvider({
            clientId: process.env.GOOGLE_CLIENT_ID,
            clientSecret: process.env.GOOGLE_CLIENT_SECRET,
			
        }),
        LineProvider({
            clientId: process.env.LINE_CLIENT_ID,
            clientSecret: process.env.LINE_CLIENT_SECRET,
			
        }),
       
    ],
	secret: 'secret',
    callbacks: {
        async signIn(user, account, profile){
			
            if (account.provider === 'google'){
                const { accessToken, idToken } = account
                
                try {
                    const response = await axios.post(
                        `${process.env.DJANGO_URL}/api/social/login/google/`,
                        {
                            access_token: accessToken,
                            id_token: idToken,
                        }
                    )

                    const { access_token } = response.data
                    user.accessToken = access_token
		
                return true
                }
				catch(error){
                return false
                }
         }

            return false
        },
        
        async jwt(token, user, account, profile, isNewUser){
			
            if (user){
                const { accessToken } = user

                token.accessToken = accessToken
				
            }
			console.log(`account:${JSON.stringify(account)}`);
			return token;
        },

        async session(session, user){
            session.accessToken = user.accessToken
            return session
        },
    },
    pages: {
        signIn: '/auth/signin',
    },
}



export default (req, res) => NextAuth(req, res, settings)

### 自分で試したこと
CALLBACK_OAUTH_ERRORの内容がcode_verifier cookieが見つからなかったり、OAuthプロバイダから無効な状態が返された場合、コールバックの処理中に発生する可能性があるとのことですが、原因が特定できません。

### 補足情報

Next.js

初心者

Django REST Framework + Next.js + NextAuth Google認証の実装が出来ない

Malohw

### 疑問点
django REST frameworkを使って、APIエンドポイントをフロントエンドから叩く場合にはCORSの設定が必要だと学んだことがあるのですが、この講座内では設定していないにもかかわらず、djnagoとnextjsで通信できているのはどうしてでしょうか。

サブスク有料会員サイト構築（アカウント認証編）のサーバー間の通信ができている理由について

tomo

### 実現したいこと
Django入門ブログ構築チュートリアル レッスン3で起こったエラーを解決したいです。
最後のように投稿ボタンを押すとタイトルのエラー画面になります。

### 発生している問題
Django入門ブログ構築チュートリアル レッスン3の
最後のように投稿ボタンを押すとタイトルのエラー画面になります。

### ソースコード


### 自分で試したこと
myvenv/lib/python3.10/site-packages/django/db/backends/sqlite3/base.py in execute, line 383この場所にエラーがあるみたいで調べてみましたが、解決に至っておりません。

### 補足情報

base.py 383行目/ return Database.Cursor.execute(self, query, params)
よろしくお願いします。

Python

IntegrityError: NOT NULL constraint failed: app_post.anthor_id

jumbo

講座のリクエストはこちらからお願いします。

いいね数が多いリクエストから検討したいと思います。

リクエストのみの書き込みでお願いします。

### 例

「○○○が流行っているので、○○○を使ったチュートリアルが知りたい」

など

個人開発

🍀講座リクエスト掲示板

### 実現したいこと
環境変数を利用したいのですが、上手くいきません、、、

### 発生している問題
環境変数を用いようとすると、下記のエラーを吐き、実行できなくなります。

CommandError: You must set settings.ALLOWED_HOSTS if DEBUG is False.


### ソースコード

```python
BASE_DIR = Path(__file__).resolve().parent.parent

env = environ.Env()
environ.Env.read_env()
print(env.str('SECRET_KEY'))

# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'シークレットキー'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = ['*']
```
*print(env.str('SECRET_KEY'))を消すと普通に実行されます。
また、シークレットキーには
SECRET_KEY=シークレットキー
という感じで代入されています。