chore: add tech articles

components/TopBar/CategoryDescriptions.ts

@@ -271,6 +271,9 @@ const categoryDescriptions: CategoryDescriptions = {
     'Coursera is an online learning platform that offers a wide range of courses, specializations, and degrees from top universities and organizations globally. It provides accessible and flexible education to individuals seeking to enhance their skills and knowledge.',
   raspberrypi:
     'Raspberry Pi is a series of low-cost, credit card-sized single-board computers developed to promote computer science education and DIY projects. With a vibrant community, Raspberry Pi empowers enthusiasts and learners to explore programming, electronics, and creative computing.',
+  // tech articles
+  react_articles:
+    'Get the best articles for react to improve your skills and knowledge.',
   // newsletters
   jsLetters:
     'It covers the latest updates, trends, and resources in the JavaScript ecosystem, keeping developers informed and engaged.',

database/data.ts

@@ -323,6 +323,16 @@ export const sidebarData: ISidebar[] = [
       { name: 'Static Site Generators', url: '/ssg', resources: DB.ssg },
     ],
   },
+  {
+    category: 'tech-articles',
+    subcategory: [
+      {
+        name: 'react',
+        url: '/react_articles',
+        resources: DB.reactArticles,
+      }
+    ]
+  },
   {
     category: 'newsletters',
     subcategory: [

database/index.ts

@@ -144,6 +144,8 @@ export { default as smartContracts } from './BlockChain/smart-contracts.json'
 export { default as truffle } from './BlockChain/truffle.json'
 export { default as hardhat } from './BlockChain/hardhat.json'
 export { default as ethers } from './BlockChain/ethers.json'
+// Tech Articles
+export { default as reactArticles } from './tech_articles/react.json'
 // Newsletters
 export { default as jsLetters } from './newsletters/js_Letters.json'
-export { default as pythonLetters } from './newsletters/py_Letters.json'
+export { default as pythonLetters } from './newsletters/py_Letters.json'

database/tech_articles/react.json

@@ -0,0 +1,37 @@
+[
+  {
+    "name": "Design Patterns",
+    "url": "https://baguilar6174.medium.com/react-design-patterns-6ab55c5ebafb",
+    "description": "Learn how to apply design patterns in your React applications.",
+    "category": "tech-articles",
+    "subcategory": "react_articles"
+  },
+  {
+    "name": "Hooks Guide",
+    "url": "https://www.freecodecamp.org/news/full-guide-to-react-hooks/",
+    "description": "Learn how to use React hooks in your applications.",
+    "category": "tech-articles",
+    "subcategory": "react_articles"
+  },
+  {
+    "name": "Testing Guide",
+    "url": "https://www.freecodecamp.org/news/testing-react-hooks/",
+    "description": "Learn how to test your React applications.",
+    "category": "tech-articles",
+    "subcategory": "react_articles"
+  },
+  {
+    "name": "Best Practices",
+    "url": "https://dev.to/sathishskdev/series/22988",
+    "description": "Learn how to write clean code and organize files in your react applications.",
+    "category": "tech-articles",
+    "subcategory": "react_articles"
+  },
+  {
+    "name": "React Router",
+    "url": "https://luqmanshaban.medium.com/react-router-a-step-by-step-guide-4c5ec964d2e9",
+    "description": "Learn how to use React Router in your applications.",
+    "category": "tech-articles",
+    "subcategory": "react_articles"
+  }
+]

types/index.ts

@@ -55,6 +55,7 @@ export type Category =
   | 'BlockChain'
   | 'newsletters'
   | 'design'
+  | 'tech-articles'
 
 export type SubCategories = {
   name: string