Giter Club home page Giter Club logo

djangoreactjs's Introduction

https://github.com/ArtOfEngineer/DjangoReactJs

Back-end

source myenv/bin/activate

cd DjangoAPI 
python manage.py runserver

# for new location
pip install django 
pip install django-cors-headers
pip install djangorestframework
virtualenv myenv

pip install django #pip install django==3.0.1
python -m django --version
django-admin startproject DjangoAPI 

pip install django-cors-headers
pip install djangorestframework



python manage.py startapp  EmployeeApp
#update settings.py, models.py
python manage.py makemigrations EmployeeApp
python manage.py migrate EmployeeApp
#verify the db.sqlite3
#creat serializers.py under EmployeeApp
#views.py, urls.py
#urls.py uder DjangoAPI
#postman test the API(PUT/POST/DELETE)

#creat media floder
#setting.py
#views.py, urls.py under EmployeeApp

Front-end

cd my-app
npm start

#for new location
npm install
npx create-react-app my-app


npm install react-bootstrap bootstrap


#App.js
#index.html
#https://react-bootstrap.github.io/getting-started/introduction/
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
  integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
  crossorigin="anonymous"
/>

#Home.js
#Department.js, Employee.js, Navigation.js
#App.js

npm install --save react-router-dom

#.env, .gitignore
#Department.js
#AddDepModal.js
#EditDepModal.js
#Department.js
#Add/Edit employee in the same way

Deploy

npm run build
将build目录的内容全部cp到django的templates/react目录里,再将templates/react/static目录放到django的static目录里

source myenv/bin/activate

cd DjangoAPI 
python manage.py createsuperuser
python manage.py runserver




$ # Get the code
$ git clone https://github.com/xxx/xx.git
$ cd xx
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Virtualenv modules installation (Windows based systems)
$ # virtualenv env
$ # .\env\Scripts\activate
$
$ # Install modules - SQLite Storage
$ pip3 install -r requirements.txt
$
$ # Create tables
$ python manage.py makemigrations
$ python manage.py migrate
$
$ # Start the application (development mode)
$ python manage.py runserver # default port 8000
$
$ # Start the app - custom port
$ # python manage.py runserver 0.0.0.0:<your_port>
$
$ # Access the web app in browser: http://127.0.0.1:8000/

djangoreactjs's People

Contributors

cjzhong avatar artofengineer avatar

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.