olygood

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

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

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

/ 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

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

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

olygood

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

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

export default {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

olygood

{
  "présentation":{
    "nom": "",
    "prénom": "",
    "fonction": "WebDeveloper",
    "date-naissance": "29 janvier 1975",
    "residant": "Liège, Belgique"
   }, 
   "reseaux":{
    "nom": "",

olygood

/*création des liens ----------------------------------------------------------*/
const PageLink = () => {
    return (
        
            <div>
                <NavLink exact to="/">Home</NavLink>
                <NavLink exact to="Works">Works</NavLink>
                <NavLink exact to="Contact">Contact</NavLink>
            </div>
 );

olygood

npm install gh-pages --save-dev  
package.json :  
 "homepage": "http://olygood.github.io/cardReact",
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
}  
npm run deploy  
aller sur gihub, repos, settings, pages, branch, gh-pages