Skip to content
GitLab
Explore
Sign in
Register
Primary navigation
Search or go to…
Project
M
myspringweb
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Releases
Package registry
Container registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
GitLab community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
HyunjinNoh
myspringweb
Commits
9ff36ab4
Commit
9ff36ab4
authored
1 year ago
by
HyunjinNoh
Browse files
Options
Downloads
Patches
Plain Diff
DB 연결 관련 오타 수정
parent
1cf3f8e9
No related branches found
No related tags found
No related merge requests found
Changes
2
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
src/main/java/kr/ajousw/myspringweb/CREATE DATABASE webdev default CHARACTER S.sql
+1
-1
1 addition, 1 deletion
...yspringweb/CREATE DATABASE webdev default CHARACTER S.sql
src/main/resources/public/app.bundle.js
+2
-2
2 additions, 2 deletions
src/main/resources/public/app.bundle.js
with
3 additions
and
3 deletions
src/main/java/kr/ajousw/myspringweb/CREATE DATABASE webdev default CHARACTER S.sql
+
1
−
1
View file @
9ff36ab4
-- Active: 1689572124222@@210.107.196.163@44098
-- Active: 1689572124222@@210.107.196.163@44098
@webdev
CREATE
DATABASE
webdev
default
CHARACTER
SET
UTF8
collate
utf8_general_ci
;
CREATE
DATABASE
webdev
default
CHARACTER
SET
UTF8
collate
utf8_general_ci
;
\ No newline at end of file
This diff is collapsed.
Click to expand it.
src/main/resources/public/app.bundle.js
+
2
−
2
View file @
9ff36ab4
...
@@ -2326,7 +2326,7 @@
...
@@ -2326,7 +2326,7 @@
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ App)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _SearchPage__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./SearchPage */ \"./src/SearchPage.js\");\n/* harmony import */ var _Favorites__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Favorites */ \"./src/Favorites.js\");\n/* harmony import */ var _MusicList__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./MusicList */ \"./src/MusicList.js\");\n/* harmony import */ var _SnackMsg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SnackMsg */ \"./src/SnackMsg.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/AppBar/AppBar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tabs/Tabs.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tab/Tab.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(arg) { var key = _toPrimitive(arg, \"string\"); return _typeof(key) === \"symbol\" ? key : String(key); }\nfunction _toPrimitive(input, hint) { if (_typeof(input) !== \"object\" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || \"default\"); if (_typeof(res) !== \"object\") return res; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (hint === \"string\" ? String : Number)(input); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\nfunction App() {\n var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(0),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n currentTab = _React$useState2[0],\n setCurrentTab = _React$useState2[1]; //탭\n var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n searchResult = _React$useState4[0],\n setSearchResult = _React$useState4[1]; //서치결과\n\n var _React$useState5 = react__WEBPACK_IMPORTED_MODULE_0___default().useState({}),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n likes = _React$useState6[0],\n setLikes = _React$useState6[1]; //좋아요결과\n var _React$useState7 = react__WEBPACK_IMPORTED_MODULE_0___default().useState({\n open: false,\n msg: ''\n }),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n snackState = _React$useState8[0],\n setSnackState = _React$useState8[1]; //스낵바열림결과\n var _React$useState9 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n _React$useState10 = _slicedToArray(_React$useState9, 2),\n favorites = _React$useState10[0],\n setFavorites = _React$useState10[1]; //재검색해도 Favorites목록이 리셋되는 것을 막기 위해 Favorites 모아놓은 상태변수 만듦\n\n //여기에 useEffect로 favorites랑 likes관리\n //사이트 처음 들어갈 때 좋아요 목록이랑 좋아요 표시가 잘 나타나도록\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n fetch(\"/likes\", {\n method: 'GET'\n }).then(function (r) {\n return r.json();\n }).then(function (likesData) {\n //DB에서 가져온 배열을 likes 형식에 맞게 바꾸기\n var formattedLikes = likesData.reduce(function (acc, item) {\n acc[item.collectionId] = true;\n return acc;\n }, {});\n setLikes(formattedLikes);\n setFavorites(
r
);\n })[\"catch\"](function (error) {\n console.error(\"Error fetching favorites:\", error);\n });\n }, []);\n var handleTabChange = function handleTabChange(event, newValue) {\n //탭\n setCurrentTab(newValue);\n };\n var toggleFavorite = function toggleFavorite(id, name) {\n //좋아요와 스낵바 상태 업데이트\n setSnackState({\n open: true,\n msg: \"\".concat(name, \" is clicked\")\n });\n if (likes[id]) {\n //이미 좋아요를 한 item이라면\n fetch(\"/likes/\".concat(id), {\n method: \"DELETE\"\n }) //fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄\n .then(function (r) {\n return r.json();\n }).then(function (r) {\n console.log(r);\n console.log(\"DELETE\");\n setLikes(function (prevLikes) {\n return _objectSpread(_objectSpread({}, prevLikes), {}, _defineProperty({}, id, !prevLikes[id]));\n }); //기존의 모든 키-값 쌍을 복사한다음 뒤에 써져있는대로 업데이트함\n setFavorites(function (prevFavorites) {\n return prevFavorites.filter(function (item) {\n return item.collectionId !== id;\n });\n });\n })[\"catch\"](function (error) {\n console.error('Error deleting likes:', error);\n });\n } else {\n //좋아요가 아직 안 되어있는 item이라면\n var selectedItem = searchResult.find(function (item) {\n return item.collectionId === id;\n });\n if (selectedItem) {\n fetch(\"/likes\", {\n method: \"POST\",\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(selectedItem)\n }) //fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄\n .then(function (r) {\n return r.json();\n }).then(function (r) {\n console.log(r);\n console.log(\"POST\");\n setLikes(function (prevLikes) {\n return _objectSpread(_objectSpread({}, prevLikes), {}, _defineProperty({}, id, !prevLikes[id]));\n });\n setFavorites(function (prevFavorites) {\n return [].concat(_toConsumableArray(prevFavorites), [selectedItem]);\n });\n })[\"catch\"](function (error) {\n console.error('Error posting likes:', error);\n });\n }\n }\n };\n var handleSnackbarClose = function handleSnackbarClose(event, reason) {\n //스낵바 닫기\n if (reason === 'clickaway') {\n return;\n }\n setSnackState({\n open: false,\n msg: ''\n });\n };\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n positions: \"fixed\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h3\",\n color: \"inherit\"\n }, \"Hyunjin's Favorite Music\")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n style: {\n height: 60,\n width: '100%'\n }\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n sx: {\n borderBottom: 1,\n borderColor: 'divider'\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n value: currentTab,\n onChange: handleTabChange,\n \"aria-label\": \"basic tabs\",\n centered: true\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"Search Music\",\n value: 0\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"Favorites\",\n value: 1\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"More Contents\",\n value: 2\n }))), currentTab == 0 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SearchPage__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n onSearch: setSearchResult\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MusicList__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n list: searchResult,\n likes: likes,\n toggleFavorite: toggleFavorite\n })), currentTab == 1 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h5\"\n }, \" Favorites \"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Favorites__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n list: favorites,\n likes: likes,\n toggleFavorite: toggleFavorite\n })), currentTab == 2 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h5\"\n }, \" More Contents \"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SnackMsg__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n open: snackState.open,\n message: snackState.msg,\n onClose: handleSnackbarClose\n }));\n}\n\n//# sourceURL=webpack://muibasic_starterkit/./src/App.js?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ App)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _SearchPage__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./SearchPage */ \"./src/SearchPage.js\");\n/* harmony import */ var _Favorites__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Favorites */ \"./src/Favorites.js\");\n/* harmony import */ var _MusicList__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./MusicList */ \"./src/MusicList.js\");\n/* harmony import */ var _SnackMsg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SnackMsg */ \"./src/SnackMsg.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/AppBar/AppBar.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tabs/Tabs.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @mui/material */ \"./node_modules/@mui/material/Tab/Tab.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(arg) { var key = _toPrimitive(arg, \"string\"); return _typeof(key) === \"symbol\" ? key : String(key); }\nfunction _toPrimitive(input, hint) { if (_typeof(input) !== \"object\" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || \"default\"); if (_typeof(res) !== \"object\") return res; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (hint === \"string\" ? String : Number)(input); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\nfunction App() {\n var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(0),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n currentTab = _React$useState2[0],\n setCurrentTab = _React$useState2[1]; //탭\n var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n searchResult = _React$useState4[0],\n setSearchResult = _React$useState4[1]; //서치결과\n\n var _React$useState5 = react__WEBPACK_IMPORTED_MODULE_0___default().useState({}),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n likes = _React$useState6[0],\n setLikes = _React$useState6[1]; //좋아요결과\n var _React$useState7 = react__WEBPACK_IMPORTED_MODULE_0___default().useState({\n open: false,\n msg: ''\n }),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n snackState = _React$useState8[0],\n setSnackState = _React$useState8[1]; //스낵바열림결과\n var _React$useState9 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n _React$useState10 = _slicedToArray(_React$useState9, 2),\n favorites = _React$useState10[0],\n setFavorites = _React$useState10[1]; //재검색해도 Favorites목록이 리셋되는 것을 막기 위해 Favorites 모아놓은 상태변수 만듦\n\n //여기에 useEffect로 favorites랑 likes관리\n //사이트 처음 들어갈 때 좋아요 목록이랑 좋아요 표시가 잘 나타나도록\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n fetch(\"/likes\", {\n method: 'GET'\n }).then(function (r) {\n return r.json();\n }).then(function (likesData) {\n //DB에서 가져온 배열을 likes 형식에 맞게 바꾸기\n var formattedLikes = likesData.reduce(function (acc, item) {\n acc[item.collectionId] = true;\n return acc;\n }, {});\n setLikes(formattedLikes);\n setFavorites(
likesData
);\n })[\"catch\"](function (error) {\n console.error(\"Error fetching favorites:\", error);\n });\n }, []);\n var handleTabChange = function handleTabChange(event, newValue) {\n //탭\n setCurrentTab(newValue);\n };\n var toggleFavorite = function toggleFavorite(id, name) {\n //좋아요와 스낵바 상태 업데이트\n setSnackState({\n open: true,\n msg: \"\".concat(name, \" is clicked\")\n });\n if (likes[id]) {\n //이미 좋아요를 한 item이라면\n fetch(\"/likes/\".concat(id), {\n method: \"DELETE\"\n }) //fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄\n .then(function (r) {\n return r.json();\n }).then(function (r) {\n console.log(r);\n console.log(\"DELETE\");\n setLikes(function (prevLikes) {\n return _objectSpread(_objectSpread({}, prevLikes), {}, _defineProperty({}, id, !prevLikes[id]));\n }); //기존의 모든 키-값 쌍을 복사한다음 뒤에 써져있는대로 업데이트함\n setFavorites(function (prevFavorites) {\n return prevFavorites.filter(function (item) {\n return item.collectionId !== id;\n });\n });\n })[\"catch\"](function (error) {\n console.error('Error deleting likes:', error);\n });\n } else {\n //좋아요가 아직 안 되어있는 item이라면\n var selectedItem = searchResult.find(function (item) {\n return item.collectionId === id;\n });\n if (selectedItem) {\n fetch(\"/likes\", {\n method: \"POST\",\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(selectedItem)\n }) //fetch 기능을 사용하여 서버에 대한 네트워크 요청을 보냄\n .then(function (r) {\n return r.json();\n }).then(function (r) {\n console.log(r);\n console.log(\"POST\");\n setLikes(function (prevLikes) {\n return _objectSpread(_objectSpread({}, prevLikes), {}, _defineProperty({}, id, !prevLikes[id]));\n });\n setFavorites(function (prevFavorites) {\n return [].concat(_toConsumableArray(prevFavorites), [selectedItem]);\n });\n })[\"catch\"](function (error) {\n console.error('Error posting likes:', error);\n });\n }\n }\n };\n var handleSnackbarClose = function handleSnackbarClose(event, reason) {\n //스낵바 닫기\n if (reason === 'clickaway') {\n return;\n }\n setSnackState({\n open: false,\n msg: ''\n });\n };\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n positions: \"fixed\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h3\",\n color: \"inherit\"\n }, \"Hyunjin's Favorite Music\")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n style: {\n height: 60,\n width: '100%'\n }\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n sx: {\n borderBottom: 1,\n borderColor: 'divider'\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n value: currentTab,\n onChange: handleTabChange,\n \"aria-label\": \"basic tabs\",\n centered: true\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"Search Music\",\n value: 0\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"Favorites\",\n value: 1\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n label: \"More Contents\",\n value: 2\n }))), currentTab == 0 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SearchPage__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n onSearch: setSearchResult\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MusicList__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n list: searchResult,\n likes: likes,\n toggleFavorite: toggleFavorite\n })), currentTab == 1 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h5\"\n }, \" Favorites \"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Favorites__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n list: favorites,\n likes: likes,\n toggleFavorite: toggleFavorite\n })), currentTab == 2 && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n align: \"center\",\n variant: \"h5\"\n }, \" More Contents \"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SnackMsg__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n open: snackState.open,\n message: snackState.msg,\n onClose: handleSnackbarClose\n }));\n}\n\n//# sourceURL=webpack://muibasic_starterkit/./src/App.js?");
/***/ }),
/***/ }),
...
@@ -2922,7 +2922,7 @@
...
@@ -2922,7 +2922,7 @@
/******/
/******/
/******/ /* webpack/runtime/getFullHash */
/******/ /* webpack/runtime/getFullHash */
/******/ (() => {
/******/ (() => {
/******/ __webpack_require__.h = () => ("
92c3fdb5f090bd684078
")
/******/ __webpack_require__.h = () => ("
caebf3bcec379db33019
")
/******/ })();
/******/ })();
/******/
/******/
/******/ /* webpack/runtime/global */
/******/ /* webpack/runtime/global */
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment