-
Vue (https://vuejs.org/)
- vuex (https://vuex.vuejs.org/)
- vue-router (https://router.vuejs.org/)
- Nuxt.js (https://nuxtjs.org/)
- Framework with vue.js, vuex, vue-router.. everything needded for frontend development pre-installed and configured.
-
CSS
- Element (http://element.eleme.io/#/en-US)
- Buefy (https://buefy.github.io/#/)
-
PHP
- Laravel (https://laravel.com/)
-
Javascript
- AdonisJS (https://adonisjs.com/)
-
Backend & Frontend in one app
- Both Laravel and Adonis can render pages from templates. You can combine all logic and frontend in one app.
-
API Based
- This allowes a more flexible app structure. You create two apps, one that contains only the frontend and one that is only responsible for the backend and data management.
- The backend provides a well defined API that allows querying and manipulating data. The Frontend accesses the data only via this api.
- Standards for API are REST (simle, more than enough for most cases), JSON API (large projects), GraphQL (really, really large projects).
- Transformers can be used to create an abstraction layer between your data and the api. (https://laravel.com/docs/5.6/eloquent-resources), (https://github.com/rhwilr/adonis-bumblebee)
Tools are mostly already pre-configured by the framework, but it is nice to know how they work.
- Webpack (https://webpack.js.org/)
- PostCSS (https://postcss.org/)
- Babel (https://babeljs.io/)
- ServiceWorker (https://developers.google.com/web/fundamentals/primers/service-workers/)
- Websocket (https://en.wikipedia.org/wiki/WebSocket)