Skip to content

JSurquin/she_travels

Repository files navigation

She Travels - Demo app - React Hook form

English version

This project was bootstrapped with Create React App.

Branches

The sample is on : main

Capture d’écran 2022-08-01 à 08 05 50

The more complex sample is on : features/custom-form

Capture d’écran 2022-08-01 à 08 05 50

But i have make design on 2 branches : ** features/main-with-style features/custom-form-with-style **

Capture d’écran 2022-08-01 à 08 06 27

Just switch between branches, npm i every switch , and restart the server

Packages use :

**on main : **

  1. react-hook-form 📝
  2. yup ✍️
  3. hookform/resolvers 📝
  4. prettier 🫧
  5. eslint (with .eslintrc.json) 📖
  6. craco config with aliases (webpack aliases) ⚙️
  7. sass 👨‍💻

on branches with suffix "with-style"

  1. tailwind 💅
  2. autoprefixer 💅
  3. postcss 💅
  4. postcss-import 💅

Git Methodology

Conventional commit : Conventional commit

Available Scripts

In the project directory, you can run:

npm start with craco

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm run build with craco

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

French version

Le projet a été créer avec Create React App.

Branches

La démo basique est sur la branche : main

Une démo plus complexe avec un custom form est sur la branche : features/custom-form

Un ajout avec redirection et design lors du submit du form sur ces deux branches : ** features/main-with-style features/custom-form-with-style **

*Il faut juste changer de branche, refaire un npm i et red

Paquets utilisées :

**sur main : **

  1. react-hook-form 📝
  2. yup ✍️
  3. hookform/resolvers 📝
  4. prettier 🫧
  5. eslint (with .eslintrc.json) 📖
  6. craco config with aliases (webpack aliases) ⚙️
  7. sass 👨‍💻

sur les branches avec le suffixe "with-style"

  1. tailwind 💅
  2. autoprefixer 💅
  3. postcss 💅
  4. postcss-import 💅

Méthodologie git

utilisation du conventional commit : Conventional commit

Les scripts disponible

Dans la racine du projet vous pouvez lancer

npm start with craco

Lancer application en mode développement Ouvrir http://localhost:3000 pour le voir dans le navigateur.

La page se recharge à chaque changement. Vous pouvez voir les erreurs lint dans le terminal si il y en a.

npm run build with craco

Lancer application en mode production dans le dossier build

L'application est prête a être deployée !

About

she travels demo sample

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published