CherryStar - Study case, starting with recent technologies
CherryStar is a compilation of technologies that you must know to work as back-end or front-end developer.
You will learn:
- MUI: framework front-end
- typescript lang
- Reactjs: useEffect, useState
- Apollo: useQuery, useMutation
- tenancy: central database to login
- tenancy: each user have a database
- GraphQL: queries and mutations
- Laravel: sail "easy docker"
- Sanctum: user-token
- WSL2: (windows with linux enviroment)
- Redis: (database key-value) to cache GraphQL and everything you like
- PostgresSQL: database
From terminal/WSL2 - You MUST clone at /var/www/
git clone https://github.com/rmurussi/cherrystar /var/www/ cd /var/www/cherrystar chmod +x docker-build.sh echo "Let's take a coffe, while docker do the hard job" && \ ./docker-build.sh
Docker Desktop - Open Bash of containner
comoposer install cp .env.example .env php artisan migrate php artisan db:seed php artisan cache:clear composer dump-autoload chown 1000:sail -R * chmod -R 777 storage -R *
Now you have the app on - WOW!
Navigate to: http://localhost:3000
Maybe you need to wait some seconds - Node is building...
Congrats, look what you did :D
- Cloned a project with git on github
- Started a project on Sail - Laravel
- Created a Docker enviroment
- Most recent technologies integration
- Front-end enviroment integrated with back-end app
- Top Skills: GraphQL, Redis, Php8.1, ReactJS, Apollo, MUI, PostgreSQL
- An application front-end + back-end that log-in using GraphQL Mutation (Sanctum). An App that have a central base to log-in, each user having a database(tenancy). When an user log-in, laravel save
database-user.access[IP/Browser/Timestamp] and return a token of the user(Sanctum).
- After log-in, you'll see a grid with a list of the latest accesses in the database of your user.
Go beyond - next steps
I suggest you do it yourself
- Change Sanctum to Oauth2 (Most used technology for log-in)
- Create access rules for users in environment back-end/front-end
- Change Tanancy token to Tanancy Domain/Sub-Domain
- Change GraphQL-Query table
Access, to load data from
- Set trust Host & Proxies
- GraphQL Mutation to register new user and tenancy
- Create a Loader on sign-in
- Create a Loader on sign-out
- Login (New Page with route)
- List Access (New Page with route)
- Register (New Page with route)
- Validation forms in reacjs with Yup
- Validate mutation and query return from GraphQL
- I18n, make the app multi-lang
- Free cloud to host your app
- CherryStar is developed by me Renan R. Murussi
- To report a bug, please submit an issue on Github. I will respond as soon as possible to resolve the issue.