You are on page 1of 2

A.

SKILL:
1. Front-end:
- HTML5
- CSS (BootStrap)
- JavaScript (Vue.js)
2. Back-end:
- Python (Django)

B. TECH STACK:
1. Front-end: HTML, CSS, JavaScript, BootStrap, Vue JS
2. Back-end: Python, Django

C. I want use:
1. Front-end: BootStrap, Vue JS
2. Back-end: Django Rest Framework

D. LANGKAH - LANGKAH:
1. Install GIT https://git-scm.com/downloads (Opsional)
2. Install VSC https://code.visualstudio.com/
3. Install Python https://www.python.org/downloads/
4. Create Virtual Environment
- Open GIT / CMD (Command Prompt)
- Run "python -m venv [your_venv_name]
- Activate the venv "[your_venv_name]\Script\activate" , write "deactive" for non active
- Yes now you are in your virtual environment

5. Create Django Project


- Go to your work path
- run "pip install Django"
- run "django-admin --version" for see your django version
- run "django-admin startproject [project_name]"
- cd [project_name]
- run "python manage.py runserver"
- Open the http://127.0.0.1:8000/ on your browser

6. Create Admin Web


- Check Database "python manage.py makemigrations"
- Create Database "python manage.py migrate"
- Run "python manage.py createsuperuser" for create superuser
- Running Server "python manage.py runserver"
- Open the http://127.0.0.1:8000/admin on your browser

7. Create Django App


- Run "python manage.py startapp [app_name]"
- Go to setting/py -> input your app name into installed_app
- Create your own model in models.py
(Note: run python manage.py makemigrations & migrate setiap ada perubahan)
- Make and Import model at admin.py
- Open the http://127.0.0.1:8000/admin for see your chance

- Create a viewset and url in urls.py in project


- Create a Serializer.py in project
- pip install djangorestframework
- Go to setting/py -> input your "rest_framework", into setting.py
- edit your app in urls.py
- Open the http://127.0.0.1:8000/api for see your api
- So dont use postman again for check, it’s same

8. Create Vue JS Project


- Install Vue CLI https://cli.vuejs.org/
- Install CLI "npm install -g @vue/cli
- Make project "Vue create your_app"
- cd your_app
- npm run serve
- Open the http://127.0.0.1:8080/ on your project

- Edit App.vue and Edit Component "Index.html" etc


- Make BootStrap the CSS Framework
- pip install "django-cors-headers" and input in setting.py "corsheaders"

You might also like