Ecommerce Website : https://e-commerce-app-by-ahmed.vercel.app/
Panaverse Site : https://panaverse-website-by-ahmed-ali-ansari.vercel.app/
blog app : https://styling-coding-nextjs-projects-6mfn.vercel.app/
todo app : https://styling-coding-nextjs-projects.vercel.app
Piaic website: https://piaic-website-by-ahmed-ali-ansari-171908.vercel.app
The repo is part of the Certified Web 3 and Metaverse Developer Program
You are required to build two versions of each project, one with TailwindCSS and the other with Chakra UI
After completeting these project you will learn the latest UI Design Trends for this repo
8 Reasons Why I Love Chakra-UI
Watch Chakra UI with Segun Adebayo, the Creator of Chakra UI
Learning Videos:
Learn how to use Chakra UI like a Pro
Build a Modern User Interface with Chakra UI
Learning Material:
Getting Started with Chakra UI
Templates:
Purity UI Dashboard - Chakra Admin Template
Figma Resources:
Design Workflow with Chakra UI and Figma
Chakra UI - Design Kit for Figma
Figma Variants Tutorial: UI Design for Developers Video
Design System:
Build Your Own Design System with ChakraUI Video
How to build a UI design system
Yogi Starter Kit for Backlight Design System based on Chakra UI
Build and Ship a Design System in 8 Steps Using Backlight
Color Resources:
You can use websites like Themera, Smart Swatch, Coolors or Palx to generate a palette. It can also be used to define your own colorScheme palette. You can also check out the default theme.
Other Resources: