Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/rmurussi/cherrystar

CherryStar is a compilation of technologies that you must know to work as back-end or front-end developer.
https://github.com/rmurussi/cherrystar

apollo apollo-client docker graphql laravel laravel-framework lighthouse material-ui mui5 nodejs php81 postgres reactjs redis sanctum-authentication tenancy tenancyforlaravel typescript

Last synced: about 12 hours ago
JSON representation

CherryStar is a compilation of technologies that you must know to work as back-end or front-end developer.

Host: GitHub
URL: https://github.com/rmurussi/cherrystar
Owner: rmurussi
License: mit
Created: 2022-08-27T21:29:35.000Z (about 2 years ago)
Default Branch: main
Last Pushed: 2024-02-26T12:26:57.000Z (7 months ago)
Last Synced: 2024-02-26T13:39:46.718Z (7 months ago)
Topics: apollo, apollo-client, docker, graphql, laravel, laravel-framework, lighthouse, material-ui, mui5, nodejs, php81, postgres, reactjs, redis, sanctum-authentication, tenancy, tenancyforlaravel, typescript
Language: PHP
Homepage:
Size: 498 KB
Stars: 9
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        


# CherryStar - Study case, starting with recent technologies

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://ko-fi.com/renanmurussi)

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

:star: Do not forget to star (Top right of this page) :star:

## Technology Stack

### Front-End

 - [Material UI V5](https://material-ui.com/)

 - [ReactJS](https://reactjs.org)

 - [typescript](https://www.typescriptlang.org)

 - [Apollo](https://www.apollographql.com/docs/)

### Back-End

 - [Laravel](https://laravel.com/docs/9.x/)

 - [GraphQL](https://graphql.org)

 - [tenancy](https://tenancyforlaravel.com/)

 - [Sanctum](https://laravel.com/docs/9.x/sanctum)

### Enviroment

 - [Docker](https://www.docker.com)

 - [Sail](https://laravel.com/docs/9.x/sail)

 - [Node](https://nodejs.org/)

 - [PostgresSQL 14](https://www.postgresql.org)

 - [Redis](https://redis.io)

 - [Php8.1](https://www.php.net)

## Getting Started

### Windows WSL2

 - [Installation Guide](https://docs.microsoft.com/en-us/windows/wsl/install)

From terminal/WSL2 - You MUST clone at /var/www/

``` bash

cd /var/www

git clone https://github.com/rmurussi/cherrystar

cd /var/www/cherrystar/cherrystar-back-end

cp .env.example .env

composer update

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 `cherrystar: laravel-cherrystar`

``` bash

composer 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](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 `Resquest data` in `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

### Laravel

 - 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 `access` with pagination

 - Set trust Host & Proxies

 - GraphQL Mutation to register new user and tenancy

### ReactJS

 - 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](https://www.npmjs.com/package/yup)

 - Validate mutation and query return from GraphQL

 - I18n, make the app multi-lang

### [Heroku](https://www.heroku.com)

 - Free cloud to host your app

# Inspirations

 - [MUI](https://github.com/mui/material-ui)

 - [Apollo - machadop1407](https://github.com/machadop1407/graphql-full-course)

 - [Berry Free - codedthemes](https://github.com/codedthemes/berry-free-react-admin-template)

 - [ReactJS - yt/PedroTechnologies](https://www.youtube.com/watch?v=QhbM9r1wdxk)

# Author

 - CherryStar is developed by me [Renan R. Murussi](https://www.linkedin.com/in/renan-rubatini-murussi-4405ba31/)

# Issues

 - To report a bug, please submit an issue on Github. I will respond as soon as possible to resolve the issue.