thecoded.prof
CMU Coding Bootcamp
1export const posts = [
2 {
3 id: 1,
4 title: "Getting Started with React",
5 content:
6 "React is a powerful library for building user interfaces. It allows developers to create reusable components that make complex applications easier to manage and maintain. React's declarative approach simplifies the code, making it predictable and easy to debug. In this post, we'll explore how to set up a basic React project and discuss the core concepts that make React a popular choice for web development.",
7 author: "Jane Doe",
8 date: "2024-03-15",
9 readTime: 5,
10 image: "/images/image1.png",
11 tags: ["React", "Beginner", "Frontend"],
12 category: "React Basics",
13 },
14 {
15 id: 2,
16 title: "Understanding Props in React",
17 content:
18 "Props, short for 'properties,' are a crucial concept in React. They allow us to pass data from a parent component to a child component, making components reusable with different data. Think of props like function parameters, where you can give each instance of a component unique information. In this post, we'll go over how to define, pass, and use props in your components, as well as some best practices for handling props effectively.",
19 author: "John Smith",
20 date: "2024-03-16",
21 readTime: 3,
22 image: "/images/image2.png",
23 tags: ["React", "Props", "Reusability"],
24 category: "React Basics",
25 },
26 {
27 id: 3,
28 title: "Exploring Different CSS Approaches",
29 content:
30 "Styling in React can be accomplished in several ways, each with its advantages and trade-offs. In this post, we’ll explore different methods of adding CSS to React components: traditional CSS files, CSS Modules for scoped styling, and CSS-in-JS solutions like styled-components. Understanding these methods will help you choose the right approach for your project and maintain scalable, maintainable styling as your application grows.",
31 author: "Amit Kumar",
32 date: "2024-03-17",
33 readTime: 5,
34 image: "/images/image3.png",
35 tags: ["CSS", "Styling", "Frontend"],
36 category: "Frontend Design",
37 },
38 {
39 id: 4,
40 title: "Mastering React Hooks",
41 content:
42 "React Hooks introduced a new way to manage state and lifecycle methods in functional components. With hooks like useState and useEffect, we can add complex logic to our components without relying on class components. This post dives into the most commonly used hooks, including useState for managing state, useEffect for side effects, and custom hooks for reusable logic. By the end, you'll be comfortable incorporating hooks into your React projects and enhancing component functionality.",
43 author: "Alex Johnson",
44 date: "2024-03-18",
45 readTime: 4,
46 image: "/images/image4.png",
47 tags: ["React", "Hooks", "Advanced"],
48 category: "Advanced React",
49 },
50];