Fakultas Ilmu Komputer UI

Skip to content
GitLab
Commit c0fd1b72 authored by Zamil Majdy's avatar Zamil Majdy
Browse files

#140382397 Setup Django + React Webpack

parent d66f17a3
Hide whitespace changes
Inline Side-by-side
.gitignore
View file @ c0fd1b72
......@@ -3,4 +3,5 @@ node_modules
.pyc
venv
assets/bundles/*
.idea
\ No newline at end of file
.idea
webpack-stats.json
README.md
View file @ c0fd1b72
# How To Build
##Requirements
## Requirements
* Node + Npm
* Python + Pip
* Node + Npm (https://nodejs.org/dist/v6.9.5/node-v6.9.5-x64.msi)
* Python + Pip (https://www.python.org/ftp/python/3.6.0/python-3.6.0-embed-amd64.zip and https://pip.pypa.io/en/stable/installing/)
##Installation
####In two commands
`git clone https://gitlab.com/PPL2017csui/PPLA1.git kape && cd kape && rm -drf .git && git init && npm install && pip install -r requirements.txt && npm run webpack`
`python manage.py runserver`
Detailed :
## Installation
* `git clone https://gitlab.com/PPL2017csui/PPLA1.git kape`
* `cd kape`
......@@ -26,10 +16,16 @@ Detailed :
For Windows you need to run `npm run webpack` and `python manage.py runserver` in different terminal.
###Migrate the database
## Migrating the database
`python manage.py migrate`
Now go to localhost:8000 and you'll see the App running!
## Database
Install postgreSQL
Run this quert `create user kape password 'kape' createdb` to create database and user.
Run `python manage.py migrate`
This project uses [Django Webpack Loader](https://github.com/owais/django-webpack-loader).
assets/js/app.jsx deleted 100644 → 0
View file @ d66f17a3
import React from 'react'
function Home() {
return (
<div className="container">
<div className="row">
<div className="col-md-2"></div>
<div className="well col-md-8">
<h1 className="center">Yuk develop KaPe :)</h1>
</div>
<div className="col-md-2"></div>
</div>
</div>
)
}
export default Home
assets/js/index.js
View file @ c0fd1b72
import React from 'react';
import Home from './app';
import Dashboard from './dashboard';
import ReactDOM from 'react-dom';
import {Router, Route, browserHistory} from 'react-router';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import {Segment} from 'semantic-ui-react';
const App = () => (
<MuiThemeProvider>
<Home />
</MuiThemeProvider>
export const Profile = () => (
<Segment>
<img src='http://semantic-ui.com/images/wireframe/media-paragraph.png' />
</Segment>
);
export const App = () => (
<Router history={browserHistory}>
<Route path="/" component={Dashboard}>
<Route path="profile" component={Profile} />
<Route path="users" component={Profile} />
</Route>
</Router>
);
ReactDOM.render( <App />, document.getElementById('react-app'))
core/templates/core/index.html
View file @ c0fd1b72
......@@ -4,9 +4,10 @@
<html>
<head>
<meta charset="UTF-8">
<title>Django React Awesome App</title>
<link rel="stylesheet" href="{% static 'css/custom.css' %}">
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
<title>Yuk Cari Tempat Kape :)</title>
<link rel="stylesheet" href="{% static 'css/custom.css' %}">
<link rel="stylesheet" href="{% static 'css/semantic-ui/semantic.min.css' %}">
<link rel="icon" type="image/png" href="{% static 'img/logo-sm.png'%}" sizes="32x32" />
</head>
<body>
......
kape/settings.py
View file @ c0fd1b72
......@@ -33,6 +33,7 @@ INSTALLED_APPS = [
'django.contrib.staticfiles',
'webpack_loader',
'core',
'rest_framework'
]
MIDDLEWARE = [
......@@ -71,8 +72,12 @@ WSGI_APPLICATION = 'kape.wsgi.application'
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.sqlite3',
'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
'ENGINE': 'django.db.backends.postgresql_psycopg2',
'NAME': 'kape',
'USER': 'postgres',
'PASSWORD': 'hue',
'HOST': 'localhost',
'PORT': '',
}
}
......@@ -114,3 +119,11 @@ USE_TZ = True
# https://docs.djangoproject.com/en/1.10/howto/static-files/
STATIC_URL = '/static/'
REST_FRAMEWORK = {
# Use Django's standard `django.contrib.auth` permissions,
# or allow read-only access for unauthenticated users.
'DEFAULT_PERMISSION_CLASSES': [
'rest_framework.permissions.DjangoModelPermissionsOrAnonReadOnly'
]
}
\ No newline at end of file
kape/urls.py
View file @ c0fd1b72
......@@ -15,9 +15,15 @@ Including another URLconf
"""
from django.conf.urls import url, include
from django.contrib import admin
from rest_framework import routers
from kape.views.user import UserViewSet
router = routers.DefaultRouter()
router.register(r'users', UserViewSet)
urlpatterns = [
url(r"^api/", include(router.urls)),
url(r'^admin/', admin.site.urls),
url(r'', include('core.urls')),
url(r'^api/api-auth/', include('rest_framework.urls', namespace='rest_framework'))
]
kape/views/user.py 0 → 100644
View file @ c0fd1b72
from django.contrib.auth.models import User
from rest_framework import serializers, viewsets
# Serializers define the API representation.
class UserSerializer(serializers.HyperlinkedModelSerializer):
class Meta:
model = User
fields = ('url', 'username', 'email', 'is_staff')
# ViewSets define the view behavior.
class UserViewSet(viewsets.ModelViewSet):
queryset = User.objects.all()
serializer_class = UserSerializer
requirements.txt
View file @ c0fd1b72
......@@ -3,5 +3,6 @@ Django==1.10.5
django-webpack-loader==0.4.1
djangorestframework==3.5.4
packaging==16.8
psycopg2==2.6.2
pyparsing==2.1.10
six==1.10.0
\ No newline at end of file
webpack-stats.json deleted 100644 → 0
View file @ d66f17a3
{"status":"done","chunks":{"main":[{"name":"main-9c374636943b76722727.js","path":"C:\\Users\\zmajd\\Documents\\code\\djangoreact\\assets\\bundles\\main-9c374636943b76722727.js"}]}}
\ No newline at end of file
webpack.config.js
View file @ c0fd1b72
......@@ -13,6 +13,7 @@ module.exports = {
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new BundleTracker({filename: './webpack-stats.json'}),
],
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Excellence In Teamwork