olygood

Twitter App

Bienvenue dans ce workshop pour la création d'une mini app Twitter. Cette application va nous permettre d'utiliser :

• zod
• react-query
• next

Pré-requis

olygood

{
  "compilerOptions": {
    "composite": true,
    "skipLibCheck": true,
    "module": "ESNext",
    "moduleResolution": "bundler",
    "allowSyntheticDefaultImports": true
  },
  "include": ["vite.config.ts"]
}

olygood

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",

olygood

/ Install Tailwind CSS
/ Install tailwindcss and its peer dependencies, then generate your tailwind.config.js and postcss.config.js files.

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

/ Configure your template paths
/ Add the paths to all of your template files in your tailwind.config.js file.

tailwind.config.js

olygood

//configure json et explication
//package.json
//ext: s'occupe des fichiers .js et .json si il change relance le server nodemon
//watch s'occupe des dossier 
"nodemonConfig": {
  "verbose": true,
  "watch": ["src", "config"],
  "ext": "js,json",
  "scripts": {
    "start": "nodemon your_main_file.js",

olygood

@tailwind base;
@tailwind components;
@tailwind utilities;

//COLORS-----------------------------------
:root {
  --color-red: #ef7b7b;
  --color-jellow: #fcf3ca;
  --color-green: #c4eada;
  /* --color-grey: #919190; */