没有合适的资源?快使用搜索试试~ 我知道了~
首页Full-stack web development using Django REST framework and React
Joel Vainikka Full-stack web development using Django REST framework and React Metropolia University of Applied Sciences Bachelor of Engineering Information and Communications Technology Thesis 16 May 2018
资源详情
资源评论
资源推荐

Joel Vainikka
Full-stack web development using Django REST
framework and React
Metropolia University of Applied Sciences
Bachelor of Engineering
Information and Communications Technology
Thesis
16 May 2018

Abstract
Author
Title
Number of Pages
Date
Joel Vainikka
Full-stack web development using Django REST framework and
React
34 pages + 3 appendices
16 May 2018
Degree
Bachelor of Engineering
Degree Programme
Information and Communications Technology
Professional Major
Software Engineering
Instructor
Peter Hjort, Senior Lecturer
The purpose of this thesis was to investigate Finnish Esports League’s (FEL’s) web service
and how it could be split into two separate services. FEL’s old service is on WordPress,
which consists of two different sides, a news site and a tournament platform for Esports
players. The goal of the split is to ease further developing of the service and maintenance.
Secondly, this study investigates full-stack development and frameworks chosen for the new
project.
A full-stack developer is an expert who understands every aspect of the stack (toolset). Full-
stack developing has been gaining popularity and stacks such as MEAN (MongoDB, Ex-
press.js, AngularJS, Node.js) have been favoured for their uniform programming language.
A new service was built with Django REST framework. Building a complete service can be
achieved with Django only, but the development team wanted to separate server and client
side. Therefore, REST was used for back-end, and the front-end application was created
with React, which connects to back-end using REST API.
The project did not end while writing this thesis, but the development continues. As an ex-
perience, working with Django REST was smooth. Splitting up server and front-end devel-
opment was a good decision and it made developing easier and helped to manage the pro-
ject. Because frameworks were new for the developers, getting to know them was time con-
suming.
Keywords
Django, Full-stack, Python, React, RESTful, WordPress

Tiivistelmä
Tekijä
Otsikko
Sivumäärä
Aika
Joel Vainikka
Full-stack-verkkosovelluskehitys Django REST -sovelluskehyk-
sen ja React-JavaScript-kirjaston avulla
34 sivua + 3 liitettä
16.5.2018
Tutkinto
insinööri (AMK)
Tutkinto-ohjelma
tieto- ja viestintätekniikka
Ammatillinen pääaine
Software Engineering
Ohjaaja
Lehtori Peter Hjort
Insinöörityön tarkoitus oli tutkia Suomen Elektronisen Urheilun Liigan (FEL) verkkopalvelua
ja sitä, miten se toteutettaisiin uudelleen jakamalla palvelu kahteen erilliseen osioon. FEL:n
verkkopalvelun vanha järjestelmä toimi WordPress-kehyksellä ja sivusto koostui uutissivus-
tosta ja pelaajille tarkoitetusta turnauspalvelusta. Jaon tarkoituksena oli hakea helpotusta
jatkokehittämiseen ja ylläpitämiseen. Samalla insinöörityössä tutkittiin, mitä on full-stack-so-
velluskehittäminen ja mitkä sovelluskehykset valittiin uuteen projektiin.
Full-stack-sovelluskehittämisellä tarkoitetaan, että sovelluskehittäjä hallitsee ohjelmistoke-
hitysprojektin jokaisen osa-alueen ja kehitystyökalun. Full-stack-kehittämisestä on tullut suo-
sittua, ja valmiita kehyspaketteja, kuten MEAN (MongoDB, Express.js, AngularJS, Node.js),
suositaan niiden yhtenäisen ohjelmointikielen vuoksi.
Uuden järjestelmän palvelinpuolta alettiin rakentaa Django REST -kehyksellä. Django-ke-
hyksellä verkkosivujen luonti onnistuisi yksistään eikä vaatisi muita kehyksiä, mutta kehittä-
jät halusivat erottaa palvelinpuolen kokonaan käyttöliittymästä. Siksi selainpuolen näkymien
hallintaan otettiin käyttöön React-kehys, jolla on helppo luoda itsenäinen ohjelmisto vain
käyttöliittymää varten. Se ottaa yhteyden palvelimeen REST-rajapinnan kautta.
Lopullinen järjestelmä oli insinöörityöraporttia kirjoitettaessa vielä kesken ja sen työstäminen
jatkui. Kokemuksena Django REST- ja React-kehyksillä työskentely oli sujuvaa. Palvelin- ja
selainpuolen ohjelmiston jakaminen erilleen oli hyvä ratkaisu, ja se helpotti kehittämistä ja
ylläpitämistä. Koska kehitysalustat olivat kehittäjille uusia, ongelmia esiintyi lähinnä vain uu-
sien kehyksien kanssa työskentelyssä. Uusiin kehyksiin tutustuminen vei kehityksessä ai-
kaa.
Avainsanat
Django, Full-stack, Python, React, RESTful, WordPress

Contents
List of Abbreviations
1 Introduction 1
2 Finnish Esports League 2
2.1 Service Introduction 2
2.2 Service Structure 4
2.2.1 Frameworks 4
2.2.2 Structure 6
2.3 Problems 7
3 Development Frameworks 10
3.1 Full-Stack Development 10
3.2 Virtual Development Environment 11
3.3 Project Tools 13
3.3.1 Django Framework 13
3.3.2 PostgreSQL Database 16
3.3.3 React Library 17
3.3.4 Bootstrap CSS 17
3.3.5 Git Version Control 18
4 Project 18
4.1 Proposition 18
4.2 Project Goal 20
4.3 Setting Up Development Environments 20
4.3.1 Front-end Environment 20
4.3.2 Back-end Environment 21
4.4 Project Example 23
4.4.1 Django Apps 23
4.4.2 Django Serializer 28
4.4.3 React Connection to API 29
5 Experiences and Thoughts 31
剩余45页未读,继续阅读

















安全验证
文档复制为VIP权益,开通VIP直接复制

评论0