Giter VIP home page Giter VIP logo

react_django_knox's Introduction

React/Django/Redux/REST template with Knox

About

This is a project template for a React/Django/Redux/REST web app using Knox token authentication. The template includes a login page, a user registration page, and a main dashboard page. The template and instructions were created primarily for personal use but may help others get started.

Get started

git clone https://github.com/kyleoverstreet/react_django_knox.git

Rename the following directories:

  • react_django_knox
  • react_django_knox/projectname
  • react_django_knox/projectname/appname
  • react_django_knox/projectname/frontend/src/components/appname
  • react_django_knox/projectname/projectname

Edit the following files:

react_django_knox/package.json

"scripts": {
  "dev": "webpack --mode development ./projectname/frontend/src/index.js --output ./projectname/frontend/static/frontend/main.js",
  "build": "webpack --mode production ./projectname/frontend/src/index.js --output ./projectname/frontend/static/frontend/main.js"
},

react_django_knox/projectname/manage.py

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'projectname.settings')

react_django_knox/projectname/projectname/settings.py

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    ...
    'appname'
]

...

ROOT_URLCONF =projectname.urls’

...

WSGI_APPLICATION =projectname.wsgi.application’

...

DATABASES = {
    # 'default': {
    #     'ENGINE': 'django.db.backends.sqlite3',
    #     'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    # }
    'default': {
        'ENGINE': 'sql_server.pyodbc',
        'NAME': 'dbname',
        'HOST': 'KYLE-PC\SQLEXPRESS',
        'OPTIONS': {
            'driver': 'ODBC Driver 17 for SQL Server'
        }
    }
}

react_django_knox/projectname/projectname/settings.py

urlpatterns = [
    path('', include('accounts.urls')),
    path('', include('frontend.urls')),
    path('', include('appname.urls'))
]

react_django_knox/projectname/wsgi.py

os.environ.setdefault(“DJANGO_SETTINGS_MODULE”, “projectname.settings”)

react_django_knox/projectname/appname/apps.py

class AppnameConfig(AppConfig):
    name = 'appname'

react_django_knox/projectname/frontend/src/components/App.Js

import Dashboard from "./appname/Dashboard";

Install dependencies with the the following commands:

pipenv shell
pipenv install
npm install

(Note: I use django-pyodb-azure to connect to a local SQL Server database. This can be removed from the Pipfile otherwise)

Start the server and build the project:

python projectname/manage.py runserver
npm run dev

Your web app will now be running on localhost:8000.

Credits

This template uses code from Brad Traversy's "Full Stack React & Django" video series on YouTube.

Video series: https://www.youtube.com/playlist?list=PLillGF-RfqbbRA-CIUxlxkUpbq0IFkX60

Code: https://github.com/bradtraversy/lead_manager_react_django

react_django_knox's People

Contributors

kyle1 avatar

Watchers

 avatar  avatar

Forkers

delaymann

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.