Fullstack? Why not (Django + Vue-js) - episode 0

Table of Contents

1. Django for backend
2. Vue.js for frontend

Settings essentials

---

Django for backend

---

• Anaconda for virtual environment 4.12.0

conda create --name django-env

activate django-env #activate the environment

Remember to install all commands below inside conda env (django_env)

• >= Python 3.10.4

• Django 4.0.5

  python -m pip install Django

• Django CORS : Cross-Origin-Resource-Policy

  python -m pip install django-cors-headers

---

Vue.js for frontend

---

• Install Nodejs 16.15.1 and npm 8.11.0 at https://nodejs.org/en/download/

• vue-cli 5.0.6

  npm install -g vue-cli

• axios 0.27.2

  npm i axios

• typescript 4.7.4 (when cannot find {frontend_project_dir}/node_modules/typescript)

  npm install typescript

or

npm install -g typescript

Additional settings:

add this line to {frontend_project_dir}/jsconfig.json

    "jsx": "preserve",

    {
  "compilerOptions": {
    "target": "es5",
    "jsx": "preserve",
    "module": "esnext",
    "baseUrl": "./",
    "moduleResolution": "node",
    "paths": {
      "@/*": [
        "src/*"
        // "./src/**/*.ts"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  }
}