Chakra UI resources (#989)

* add react.js resources

* add css resources

* add graphql resources

* add redux resources

* add typescript resources

* add next.js resources

* add chakra-ui resources

* Remove duplicate links

Co-authored-by: Kamran Ahmed <kamranahmed.se@gmail.com>

content/roadmaps/100-frontend/content/114-css-frameworks/114-js-first/101-chakra-ui.md

@@ -1 +1,12 @@
-# Chakra ui
+# Chakra UI
+
+Chakra UI is a simple, modular and accessible component library that gives you the building blocks you need to build your React applications.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Website' href='https://chakra-ui.com/'>Chakra UI Website</BadgeLink>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://chakra-ui.com/docs/getting-started'>Chakra UI Official Getting Started</BadgeLink>
+<BadgeLink badgeText='Course' colorScheme='green' href='https://egghead.io/courses/build-a-modern-user-interface-with-chakra-ui-fac68106'>Build a Modern User Interface with Chakra UI</BadgeLink>
+<BadgeLink badgeText='Course' colorScheme='green' href=''></BadgeLink>
+<BadgeLink badgeText='Watch' href='https://youtu.be/wI2vqXsjsIo'>Official Getting Started Video</BadgeLink>
+<BadgeLink badgeText='Watch' href='https://youtu.be/s-bIsz-NR3c'>Chakra UI Crash Course</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.freecodecamp.org/news/why-should-you-start-using-chakraui/'>Why You Should Start Using Chakra UI</BadgeLink>