Frontend in react and nextjs
We have not changed since sprint 2, which can be found at
Front end
...
Layer
...
Framework
...
Notes
Back end (Finalised and Completed in Sprint 1-2)
https://unswseng.atlassian.net/l/c/n1RmSeTy
Final choice
NodeJS
We chose to use NodeJS as it’s a very well supported and commonly used runtime. NPM allowed us to easily install further frameworks and libraries which made development much easier.
NextJS
NextJS was chosen as it adds a fairly easy to use the framework to work with that Joshua had some experience with. None of its more advanced rendering features was used however it allowed for a fairly easy to understand format for the frontend development.
React
React was used as a library to enable interactive and reactive parts of the site.
Front end
Name | Type | Current team member knowledge of frameworks | Difficulty of frameworks to learn | How well the framework is documented | Availability / pricing of platforms | Additional Notes |
|---|---|---|---|---|---|---|
Express |
Back-end
Nodejs framework | Team has no experience | -Medium level | -Well documented | Free + open source | N/A |
Next.js |
Back-end
Team has no experience
Nodejs framework | Joshua has minimal experience. | -Easy to use simply -Some parts like different rendering types can be more complicated | -Fairly well documented -Can find some debugging more difficult due to differences between frameworks | Free + open source | N/A |
Boot strap | CSS Framework |
React
Front-end
Team has no experience | -Easy to use however can be more complicated then simple plain javascript however easier for better looking designs | -Well documented with lots of support | Free + open source | Adds extra visual flair |
React | Library | Joshua has minimal. Rest of team has no experience |
-Fialry easy to learn, has some advance features -Easy to get started with | -Very well documented as very commonly used | Free + open source |
Angular
Front-end
Pro: Reuse HTML code anywhere in the app to build other components Con: not as in depth documentation Cons : limits team size | |||||
Angular | Javascript framework | Team has no experience | -Quite difficult to learn in comparison to React -Steep learning curve. | -Well documented however less common then react | Free + open source |
Vue
Front-end
NodeJS
Team has no experience
-Clean code : compiles JS and will point out errors -Server performance : improved in app -Issues : complex to understand , migrating from old version to new Angular 8 version can slow down project | |||||
Vue | Javascript framework | Team has no experience | -Challenging to debug | -Well documented however can be harder to find correct help | Free + open source |
Vanilla
Ext JS
Team has no experience
Different packages :
Community : Free (for up to 5 developers)
Pro: $1300 per developer.
Enterprise: $1900 per developer
Flexibility - write both HTML and JS in the template -Fast and lightweight -Reuse into existing apps Issues : potential for issues / errors in the codebase for teams working on a big project | ||||||
Vanilla | Plain javascript | Team has minimal expeirence | -Very simple -Lack of features means doing some things can escelate quickly | -Extremely well documented as used within all other options | Free | N/A |
NodeJS | JavaScript runtime enviorment | Joshua has minimal experience |
| Very well documented as extremely commonly used | Free + open source | Allows integration of other libraries and frameworks easily |