taiseen / add-location-react-app

CRUD App | Acdemayi

15 - March - 2022

add location app --> React + TailwindCSS

Live Link

Features has or Learning Context...

• React Router v6
• Custom Modal Popup
• Tailwind CSS base UI
• Project Folder Structure
• array of object reverse order
• Context API
  • (centrally data manipulation)
  • (multiple context api)
• Dynamically id generated by UUID package
  • (for temporary stored data like : array of object)
• Dummy JSON file DataBase (Full CRUD testing...)
• using of tost effect for notifications
• using of tool-tip effect for button hover
• connect to FireBase DB

Project is created by React Yarn

Package Installed...

• yarn create react-app testing
• yarn add react-router-dom
• yarn add -D tailwindcss postcss autoprefixer
• npx tailwindcss init -p
• yarn add uuid
• yarn add react-toastify
• yarn add @tippyjs/react

this -D switch create devDependencies section at package.json file

"devDependencies": {
    "autoprefixer": "^10.4.2",
    "postcss": "^8.4.8",
    "tailwindcss": "^3.0.23"
}

• go to >>> tailwind.config.js file & add these lines...

content: [
    "./src/**/*.{js,jsx,ts,tsx}",
    "./public/index.html"
],

• must add tailwind directives into index.css file

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

• if you clone this repo,
  1st must run ==> yarn