+ 로그인
+ 회원가입
+
+ {movie.title}
+ {movie.release_date}
+ Home Page
+ ); +}; + +export default HomePage; \ No newline at end of file diff --git a/src/pages/login.jsx b/src/pages/login.jsx new file mode 100644 index 0000000..aa377e9 --- /dev/null +++ b/src/pages/login.jsx @@ -0,0 +1,10 @@ +// home.jsx + +const LoginPage = () => { + return ( +로그인 페이지
+ ); + +}; + +export default LoginPage; \ No newline at end of file diff --git a/src/pages/not-found.jsx b/src/pages/not-found.jsx new file mode 100644 index 0000000..ce83f92 --- /dev/null +++ b/src/pages/not-found.jsx @@ -0,0 +1,7 @@ +const NotFound = () => { + return ( +찾을 수 없는 페이지
+ ); +}; + +export default NotFound; \ No newline at end of file diff --git a/src/pages/now-playing.jsx b/src/pages/now-playing.jsx new file mode 100644 index 0000000..882af2f --- /dev/null +++ b/src/pages/now-playing.jsx @@ -0,0 +1,7 @@ +const NowPlayingPage = () => { + return ( +현재 상영하고 있는 작품
+ ); +}; + +export default NowPlayingPage; \ No newline at end of file diff --git a/src/pages/popular.jsx b/src/pages/popular.jsx new file mode 100644 index 0000000..7cb6119 --- /dev/null +++ b/src/pages/popular.jsx @@ -0,0 +1,8 @@ + +const PopularPage = () => { + return ( +인기 작품
+ ); +}; + +export default PopularPage; \ No newline at end of file diff --git a/src/pages/search.jsx b/src/pages/search.jsx new file mode 100644 index 0000000..c1caac0 --- /dev/null +++ b/src/pages/search.jsx @@ -0,0 +1,8 @@ +// home.jsx +const SearchPage = () => { + return ( +검색 페이지
+ ); +}; + +export default SearchPage; \ No newline at end of file diff --git a/src/pages/signup.jsx b/src/pages/signup.jsx new file mode 100644 index 0000000..2716b5d --- /dev/null +++ b/src/pages/signup.jsx @@ -0,0 +1,8 @@ +// home.jsx +const SignPage = () => { + return ( +회원가입 페이지
+ ); +}; + +export default SignPage; \ No newline at end of file diff --git a/src/pages/top-rated.jsx b/src/pages/top-rated.jsx new file mode 100644 index 0000000..9615b9c --- /dev/null +++ b/src/pages/top-rated.jsx @@ -0,0 +1,7 @@ +const TopRatedPage = () => { + return ( +top10 작품
+ ); +}; + +export default TopRatedPage; \ No newline at end of file diff --git a/src/pages/up-coming.jsx b/src/pages/up-coming.jsx new file mode 100644 index 0000000..da9895b --- /dev/null +++ b/src/pages/up-coming.jsx @@ -0,0 +1,8 @@ + +const UpComingPage = () => { + return ( +개봉작
+ ); +}; + +export default UpComingPage; \ No newline at end of file diff --git a/src/styles/view.css b/src/styles/view.css new file mode 100644 index 0000000..58541b9 --- /dev/null +++ b/src/styles/view.css @@ -0,0 +1,19 @@ +.movie{ + position: relative; + } + + .overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + opacity: 0; + border-radius: 10px; + + } + + .movie:hover .overlay { + opacity: 1; + } \ No newline at end of file diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..861b04b --- /dev/null +++ b/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react-swc' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [react()], +}) diff --git a/week2/.gitignore b/week2/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/week2/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/week2/README.md b/week2/README.md new file mode 100644 index 0000000..f768e33 --- /dev/null +++ b/week2/README.md @@ -0,0 +1,8 @@ +# React + Vite + +This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. + +Currently, two official plugins are available: + +- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh +- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh diff --git a/week2/eslint.config.js b/week2/eslint.config.js new file mode 100644 index 0000000..238d2e4 --- /dev/null +++ b/week2/eslint.config.js @@ -0,0 +1,38 @@ +import js from '@eslint/js' +import globals from 'globals' +import react from 'eslint-plugin-react' +import reactHooks from 'eslint-plugin-react-hooks' +import reactRefresh from 'eslint-plugin-react-refresh' + +export default [ + { ignores: ['dist'] }, + { + files: ['**/*.{js,jsx}'], + languageOptions: { + ecmaVersion: 2020, + globals: globals.browser, + parserOptions: { + ecmaVersion: 'latest', + ecmaFeatures: { jsx: true }, + sourceType: 'module', + }, + }, + settings: { react: { version: '18.3' } }, + plugins: { + react, + 'react-hooks': reactHooks, + 'react-refresh': reactRefresh, + }, + rules: { + ...js.configs.recommended.rules, + ...react.configs.recommended.rules, + ...react.configs['jsx-runtime'].rules, + ...reactHooks.configs.recommended.rules, + 'react/jsx-no-target-blank': 'off', + 'react-refresh/only-export-components': [ + 'warn', + { allowConstantExport: true }, + ], + }, + }, +] diff --git a/week2/index.html b/week2/index.html new file mode 100644 index 0000000..0c589ec --- /dev/null +++ b/week2/index.html @@ -0,0 +1,13 @@ + + + + + + +Osis please come to Korea ....!
+This part is mission 1
+ + +
+ {todos.map((todo, _) => (
+
+
+ )
+}
+
+
+function App() {
+
+ return (
+ <>
+
+ {/* 수정이 아닐때 */}
+ {editingId !== todo.id && (
+
+ ))}
+
+
+ )}
+
+ {/* 수정 중일때 */}
+ {editingId === todo.id && (
+ {todo.id}.
+{todo.task}
+
+
+ )}
+
+
+
+ {/* editingId !== todo.id 수정이 아닌 상태 */}
+ {/* editingId === todo.id 수정 중인 상태 */}
+ {editingId === todo.id ? (
+
+ ) : (
+
+ )}
+ {todo.id}.
+ setEditText(e.target.value)} + /> +This part is mission 2
+
+ {MOVIES.results.map((movie) => (
+
+ );
+ };
+
+ export default View;
\ No newline at end of file
diff --git a/week2/src/index.css b/week2/src/index.css
new file mode 100644
index 0000000..e69de29
diff --git a/week2/src/main.jsx b/week2/src/main.jsx
new file mode 100644
index 0000000..89f91e5
--- /dev/null
+++ b/week2/src/main.jsx
@@ -0,0 +1,10 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import App from './App.jsx'
+import './index.css'
+
+createRoot(document.getElementById('root')).render(
+
+ 
+
+
+ ))}
+