✨ add react lecture (#151)

frontend/lecture/src/components/Callout/index.tsx

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+
+export const Callout = (props: PropsWithChildren<{ title: string }>) => {
+  return (
+    <div className="mb-4 border-l-4 border-blue-500 bg-blue-100 p-4 text-base text-blue-700">
+      <p className="font-bold">{props.title}</p>
+      {props.children}
+    </div>
+  );
+};

frontend/lecture/src/lectures/ReactApis/lecture.tsx

@@ -0,0 +1,22 @@
+import { Slides } from '@/components/Slides';
+import { getLectureItem } from '@/lectures';
+
+export const reactApisLecture = getLectureItem({
+  title: '리액트 기능들',
+  description:
+    'Context API, useState, useEffect, useMemo, memo, useCallback, Custom Hooks',
+  date: new Date('2024-09-11'),
+  element: (
+    <Slides
+      slides={[
+        { title: 'Context API', content: <div></div> },
+        { title: 'hooks: useState', content: <div></div> },
+        { title: 'hooks: useEffect', content: <div></div> },
+        { title: 'hooks: useMemo', content: <div></div> },
+        { title: 'memo', content: <div></div> },
+        { title: 'hooks: useCallback', content: <div></div> },
+        { title: 'Custom Hooks', content: <div></div> },
+      ]}
+    />
+  ),
+});