From 31ca2edf272f05c1efcb15d97c0072c44997de30 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Mon, 12 Jun 2023 20:20:33 +0900 Subject: [PATCH 01/12] =?UTF-8?q?[=20feat=20]=20=EB=9D=BC=EC=9A=B0?= =?UTF-8?q?=ED=84=B0=20=EC=84=B1=EA=B3=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/App.js | 42 ++++++++------- week2/todomate/index.js | 21 ++------ week2/todomate/src/components/router.js | 68 ++++++++++++++++++------- week2/todomate/src/pages/home.js | 8 +-- week2/todomate/src/pages/mycategory.js | 8 +-- 5 files changed, 87 insertions(+), 60 deletions(-) diff --git a/week2/todomate/App.js b/week2/todomate/App.js index 1d7ba3b..a0348ed 100644 --- a/week2/todomate/App.js +++ b/week2/todomate/App.js @@ -1,19 +1,27 @@ -// import createRouter from './src/components/router.js'; +import { Home } from "./src/pages/home"; +import { MyCategory } from "./src/pages/mycategory"; -// document.querySelector('#app').innerHTML += ` -// +const ROUTE_LIST = [ + { path: "/", element: Home }, + { path: "/mycategory", element: MyCategory }, +]; -// `; +export default class App { + constructor($container) { + this.$container = $container; + let currentPage = undefined; + + const init = () => { + const findMatchedRoute = () => ROUTE_LIST.find((route) => route.path === location.pathname); + + const route = () => { + currentPage = null; + const TargetPage = findMatchedRoute()?.element || Error404; + currentPage = new TargetPage(this.$container); + }; + + route(); + }; + init(); + } +} \ No newline at end of file diff --git a/week2/todomate/index.js b/week2/todomate/index.js index c1a1764..8205e1d 100644 --- a/week2/todomate/index.js +++ b/week2/todomate/index.js @@ -1,18 +1,5 @@ -import { createRouter } from './src/components/router.js'; -import { Home } from './src/pages/home.js'; +import App from "./App"; -window.onload = Home; -const router = createRouter(); - -let homeButton = document.querySelector('#home'); -let myCategoryButton = document.querySelector('#mycategory'); - -// myCategoryButton.addEventListener('click', function () { -// console.log('mycategory'); -// router.navigate('/mycategory'); -// }); - -// homeButton.addEventListener('click', function () { -// console.log('home'); -// router.navigate('/'); -// }); +window.addEventListener("DOMContentLoaded", () => { + new App(document.querySelector("#app")); +}); \ No newline at end of file diff --git a/week2/todomate/src/components/router.js b/week2/todomate/src/components/router.js index c78f447..383b4d1 100644 --- a/week2/todomate/src/components/router.js +++ b/week2/todomate/src/components/router.js @@ -1,20 +1,52 @@ -import { Home } from '../pages/home'; -import { MyCategory } from '../pages/mycategory'; -const pages = { - home: (window.onload = Home), - mycategory: (window.onload = MyCategory), -}; - -// export function createRouter() { -// const router = { -// navigate(fragment) { -// console.log(fragment); -// // fragment === '/' ? pages.home : pages.mycategory; -// fragment === '/' && pages.home; -// }, -// }; +// // import { Home } from '../pages/home'; +// // import { MyCategory } from '../pages/mycategory'; +// // const pages = { +// // home: (window.onload = Home), +// // mycategory: (window.onload = MyCategory), +// // }; + +// // // export function createRouter() { +// // // const router = { +// // // navigate(fragment) { +// // // console.log(fragment); +// // // // fragment === '/' ? pages.home : pages.mycategory; +// // // fragment === '/' && pages.home; +// // // }, +// // // }; + +// // // return router; +// // // // } +// // // fragment === '/' ? pages.home : pages.home; +// // // console.log(window.location.hash); + +// import Error404 from "./pages/error404"; +// // import Home from "./pages/home"; +// // import MyCategory from "./pages/mycategory"; + +// import { Home } from '../pages/home'; +// import { MyCategory } from '../pages/mycategory'; -// return router; +// const ROUTE_LIST = [ +// { path: "/", element: Home }, +// { path: "/mycategory", element: MyCategory }, +// ]; + +// function Router($container) { +// this.$container = $container; +// let currentPage = undefined; + +// const init = () => { +// const findMatchedRoute = () => +// ROUTE_LIST.find((route) => route.path === location.pathname); + +// const route = () => { +// currentPage = null; +// const TargetPage = findMatchedRoute()?.element || Error404; +// currentPage = new TargetPage(this.$container); +// }; + +// route(); +// }; +// init(); // } -fragment === '/' ? pages.home : pages.mycategory; -console.log(window.location.hash); +// export default App; \ No newline at end of file diff --git a/week2/todomate/src/pages/home.js b/week2/todomate/src/pages/home.js index 1753aa4..c19661d 100644 --- a/week2/todomate/src/pages/home.js +++ b/week2/todomate/src/pages/home.js @@ -14,14 +14,14 @@ export function Home() { `; + { + data.categorys.map( + ({ id, category }) => + (document.querySelector("ul.calendar__column--flex").innerHTML += ` +
  • ${category}
    • + `), + ); + } + const list = document.querySelector(".calendar__column--flex"); let currentItemIndex = null; From 669e4f438f88268e190ea46c1e7f383412caa18e Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Mon, 12 Jun 2023 23:16:48 +0900 Subject: [PATCH 07/12] =?UTF-8?q?[=20style=20]=20=EB=A1=9C=EC=BB=AC=20?= =?UTF-8?q?=EC=8A=A4=ED=86=A0=EB=A6=AC=EC=A7=80=EC=97=90=20=EC=A0=80?= =?UTF-8?q?=EC=9E=A5=ED=95=98=EB=8A=94=20=EB=A1=9C=EC=A7=81=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/components/counter.js | 40 +++++++++------------ week2/todomate/src/components/data.js | 18 +++++----- week2/todomate/src/pages/home.js | 46 ++++++++++++++++++------ week2/todomate/src/pages/mycategory.js | 23 +++++++----- 4 files changed, 75 insertions(+), 52 deletions(-) diff --git a/week2/todomate/src/components/counter.js b/week2/todomate/src/components/counter.js index 3d4b0cc..57e9c20 100644 --- a/week2/todomate/src/components/counter.js +++ b/week2/todomate/src/components/counter.js @@ -1,37 +1,32 @@ function solvedTodo(tag) { let input = document.querySelector(`#${tag}`); - let cnt = document.querySelector( - '.calendar__column > li:nth-child(6) > .calendar__column--to--do--list' - ).textContent; + let cnt = document.querySelector(".calendar__column > li:nth-child(6) > .calendar__column--to--do--list").textContent; if (!input.checked) { - document.querySelector( - '.calendar__column > li:nth-child(6) > .calendar__column--to--do--list' - ).innerText = cnt - 1; + document.querySelector(".calendar__column > li:nth-child(6) > .calendar__column--to--do--list").innerText = cnt - 1; } else { - document.querySelector( - '.calendar__column > li:nth-child(6) > .calendar__column--to--do--list' - ).innerText = parseInt(cnt) + 1; + document.querySelector(".calendar__column > li:nth-child(6) > .calendar__column--to--do--list").innerText = + parseInt(cnt) + 1; } } function openModal(header) { - let modal = document.querySelector('.modal__wrapper'); - modal.style.display = 'flex'; - let input_tag = document.querySelector('.modal--write--todo'); + let modal = document.querySelector(".modal__wrapper"); + modal.style.display = "flex"; + let input_tag = document.querySelector(".modal--write--todo"); input_tag.focus(); clicked_header = header; } function closeModal() { - let modal = document.querySelector('.modal__wrapper'); - modal.style.display = 'none'; + let modal = document.querySelector(".modal__wrapper"); + modal.style.display = "none"; } function addTodo() { - let input = document.querySelector('.modal--write--todo').value; - let id = clicked_header.getAttribute('id'); + let input = document.querySelector(".modal--write--todo").value; + let id = clicked_header.getAttribute("id"); let tab = document.querySelector(`#${id}`); tab.innerHTML += ` @@ -42,14 +37,11 @@ function addTodo() { `; - let input_tag = document.querySelector('input'); - input_tag.value = ''; + let input_tag = document.querySelector("input"); + input_tag.value = ""; input_tag.focus(); - let cnt = document.querySelector( - '.calendar__column > li:nth-child(6) > .calendar__column--to--do--list' - ).textContent; - document.querySelector( - '.calendar__column > li:nth-child(6) > .calendar__column--to--do--list' - ).innerText = parseInt(cnt) + 1; + let cnt = document.querySelector(".calendar__column > li:nth-child(6) > .calendar__column--to--do--list").textContent; + document.querySelector(".calendar__column > li:nth-child(6) > .calendar__column--to--do--list").innerText = + parseInt(cnt) + 1; } diff --git a/week2/todomate/src/components/data.js b/week2/todomate/src/components/data.js index 38ae90b..261979c 100644 --- a/week2/todomate/src/components/data.js +++ b/week2/todomate/src/components/data.js @@ -96,13 +96,13 @@ export const data = { todos: ["노래듣기", "더 글로리 보기"], }, ], - categorys: [ - { id: 1, category: "CAU" }, - { id: 2, category: "ROUTINE" }, - { id: 3, category: "ETC" }, - { id: 4, category: "FRIENDS" }, - { id: 5, category: "CLEAN" }, - { id: 6, category: "MEETING" }, - { id: 7, category: "PLAY" }, - ], + // categorys: [ + // { id: 1, category: "CAU" }, + // { id: 2, category: "ROUTINE" }, + // { id: 3, category: "ETC" }, + // { id: 4, category: "FRIENDS" }, + // { id: 5, category: "CLEAN" }, + // { id: 6, category: "MEETING" }, + // { id: 7, category: "PLAY" }, + // ], }; diff --git a/week2/todomate/src/pages/home.js b/week2/todomate/src/pages/home.js index c19661d..2c63511 100644 --- a/week2/todomate/src/pages/home.js +++ b/week2/todomate/src/pages/home.js @@ -1,7 +1,7 @@ -import { data } from '../components/data'; +import { data } from "../components/data"; export function Home() { - document.querySelector('#app').innerHTML = ` + document.querySelector("#app").innerHTML = `
    🌷 WEB TO DO MATE 🌷
    @@ -32,28 +32,52 @@ export function Home() { { data.calendar.map( ({ id, day }) => - (document.querySelector('div.calendar__column').innerHTML += ` + (document.querySelector("div.calendar__column").innerHTML += `

    ${day}

    - `) + `), ); } { data.calendar.map( ({ id, list, date }) => - (document.querySelector('ul.calendar__column').innerHTML += ` + (document.querySelector("ul.calendar__column").innerHTML += `
  • ${list}

    ${date}

    • - `) + `), ); } + const basicCategorys = window.localStorage.getItem("categorys"); + console.log(basicCategorys); + + // if (basicCategorys === null) { + // { + // data.categorys.map( + // ({ category }) => + // (document.querySelector("ul.calendar__column--flex").innerHTML += ` + //
  • ${category}
    • + // `), + // ); + // } + // } else { + // document.querySelector("ul.calendar__column--flex").innerHTML += basicCategorys; + // } + + // if (basicCategorys !== null) { + // const datas = data.lists; + // } else { + // const newdatas = [...data.lists]; + // const datas = []; + // datas.push(newdatas.filter(({ header }) => header !== basicCategorys.header)); + // } + { data.lists.map( ({ id, header, todos }) => - (document.querySelector('.lists').innerHTML += ` + (document.querySelector(".lists").innerHTML += `
    - `) + `), ); } } diff --git a/week2/todomate/src/pages/mycategory.js b/week2/todomate/src/pages/mycategory.js index 6fac634..ace699c 100644 --- a/week2/todomate/src/pages/mycategory.js +++ b/week2/todomate/src/pages/mycategory.js @@ -27,17 +27,17 @@ export function MyCategory() { `; + const list = document.querySelector(".calendar__column--flex"); + { - data.categorys.map( - ({ id, category }) => - (document.querySelector("ul.calendar__column--flex").innerHTML += ` -
  • ${category}
    • - `), + data.lists.map( + ({ header }) => + (list.innerHTML += ` +
  • ${header}
    • + `), ); } - const list = document.querySelector(".calendar__column--flex"); - let currentItemIndex = null; let currentItem = null; @@ -64,6 +64,13 @@ export function MyCategory() { currentDropItem.before(currentItem); } - window.localStorage.setItem("categorys", [...e.target.parentElement.children]); + // window.localStorage.getItem("categorys"); + // console.log([...e.target.parentElement.children][0].innerText); + const storeList = []; + { + [...e.target.parentElement.children].map(({ innerText }) => storeList.push(innerText)); + } + + window.localStorage.setItem("categorys", storeList); }); } From e577c91d5ed22b8e27cdc0569411d06b00b0c9e0 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Mon, 12 Jun 2023 23:17:14 +0900 Subject: [PATCH 08/12] =?UTF-8?q?[=20etc=20]=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=20=EB=A1=9C=EC=A7=81=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/pages/mycategory.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/week2/todomate/src/pages/mycategory.js b/week2/todomate/src/pages/mycategory.js index ace699c..1f2fb79 100644 --- a/week2/todomate/src/pages/mycategory.js +++ b/week2/todomate/src/pages/mycategory.js @@ -64,8 +64,6 @@ export function MyCategory() { currentDropItem.before(currentItem); } - // window.localStorage.getItem("categorys"); - // console.log([...e.target.parentElement.children][0].innerText); const storeList = []; { [...e.target.parentElement.children].map(({ innerText }) => storeList.push(innerText)); From 26d61662199abee560289fa831f199288723d7bf Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Mon, 12 Jun 2023 23:57:32 +0900 Subject: [PATCH 09/12] =?UTF-8?q?[=20feat=20]=20=EC=A0=80=EC=9E=A5?= =?UTF-8?q?=EB=90=9C=20=EC=88=9C=EC=84=9C=EB=8C=80=EB=A1=9C=20=EB=8B=A4?= =?UTF-8?q?=EC=8B=9C=20=EB=BF=8C=EB=A0=A4=EC=A7=80=EA=B8=B0=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/pages/home.js | 149 ++++++++++++++++++++++--------- 1 file changed, 109 insertions(+), 40 deletions(-) diff --git a/week2/todomate/src/pages/home.js b/week2/todomate/src/pages/home.js index 2c63511..1c565ba 100644 --- a/week2/todomate/src/pages/home.js +++ b/week2/todomate/src/pages/home.js @@ -50,10 +50,10 @@ export function Home() { ); } - const basicCategorys = window.localStorage.getItem("categorys"); - console.log(basicCategorys); + const basicCategorys = window.localStorage.getItem("categorys").split(","); + // console.log(basicCategorys.split(",")); - // if (basicCategorys === null) { + // if (basicCategorys.length === 0) { // { // data.categorys.map( // ({ category }) => @@ -66,43 +66,112 @@ export function Home() { // document.querySelector("ul.calendar__column--flex").innerHTML += basicCategorys; // } - // if (basicCategorys !== null) { - // const datas = data.lists; - // } else { - // const newdatas = [...data.lists]; - // const datas = []; - // datas.push(newdatas.filter(({ header }) => header !== basicCategorys.header)); - // } + // const datas = []; - { - data.lists.map( - ({ id, header, todos }) => - (document.querySelector(".lists").innerHTML += ` -
    - -
    ${header}+
    -
      - ${todos.map( - (todo, idx) => - ` -
    • - - -

      ${todo}

      -
      • - `, - )} -
    -
    - `), - ); + if (!basicCategorys) { + { + data.lists.map( + ({ id, header, todos }) => + (document.querySelector(".lists").innerHTML += ` +
    + +
    ${header}+
    +
      + ${todos.map( + (todo, idx) => + ` +
    • + + +

      ${todo}

      +
      • + `, + )} +
    +
    + `), + ); + } + } else { + const newdatas = [...data.lists]; + const datas = []; + // console.log(basicCategorys.map((category) => newdatas.filter(({ header }) => header === category)[0])); + + // console.log(basicCategorys[0]); + // console.log(newdatas); + datas.push(basicCategorys.map((category) => newdatas.filter(({ header }) => header === category)[0])); + console.log(datas[0]); + + { + datas[0].map( + ({ id, header, todos }) => + (document.querySelector(".lists").innerHTML += ` +
    + +
    ${header}+
    +
      + ${todos.map( + (todo, idx) => + ` +
    • + + +

      ${todo}

      +
      • + `, + )} +
    +
    + `), + ); + } } + // console.log(basicCategorys !== null); + // { + // data.lists.map( + // ({ id, header, todos }) => + // (document.querySelector(".lists").innerHTML += ` + //
    + // + //
    ${header}+
    + //
      + // ${todos.map( + // (todo, idx) => + // ` + //
    • + // + // + //

      ${todo}

      + //
      • + // `, + // )} + //
    + //
    + // `), + // ); + // } } From 751e8a63fa024c4532688d00ac41eb188d02bb52 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Mon, 12 Jun 2023 23:57:57 +0900 Subject: [PATCH 10/12] =?UTF-8?q?[=20etc=20]=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=20=EC=BD=94=EB=93=9C=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/pages/home.js | 54 -------------------------------- 1 file changed, 54 deletions(-) diff --git a/week2/todomate/src/pages/home.js b/week2/todomate/src/pages/home.js index 1c565ba..ce87b4a 100644 --- a/week2/todomate/src/pages/home.js +++ b/week2/todomate/src/pages/home.js @@ -51,22 +51,6 @@ export function Home() { } const basicCategorys = window.localStorage.getItem("categorys").split(","); - // console.log(basicCategorys.split(",")); - - // if (basicCategorys.length === 0) { - // { - // data.categorys.map( - // ({ category }) => - // (document.querySelector("ul.calendar__column--flex").innerHTML += ` - //
  • ${category}
    • - // `), - // ); - // } - // } else { - // document.querySelector("ul.calendar__column--flex").innerHTML += basicCategorys; - // } - - // const datas = []; if (!basicCategorys) { { @@ -103,13 +87,7 @@ export function Home() { } else { const newdatas = [...data.lists]; const datas = []; - // console.log(basicCategorys.map((category) => newdatas.filter(({ header }) => header === category)[0])); - - // console.log(basicCategorys[0]); - // console.log(newdatas); datas.push(basicCategorys.map((category) => newdatas.filter(({ header }) => header === category)[0])); - console.log(datas[0]); - { datas[0].map( ({ id, header, todos }) => @@ -142,36 +120,4 @@ export function Home() { ); } } - // console.log(basicCategorys !== null); - // { - // data.lists.map( - // ({ id, header, todos }) => - // (document.querySelector(".lists").innerHTML += ` - //
    - // - //
    ${header}+
    - //
      - // ${todos.map( - // (todo, idx) => - // ` - //
    • - // - // - //

      ${todo}

      - //
      • - // `, - // )} - //
    - //
    - // `), - // ); - // } } From 5dd2af1a9e156c31a1a7588535b4afe6614b0073 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Tue, 13 Jun 2023 00:44:22 +0900 Subject: [PATCH 11/12] =?UTF-8?q?[=20feat=20]=20=EC=9D=B4=EB=AF=B8=20?= =?UTF-8?q?=EC=9E=88=EB=8A=94=20=EC=9D=BC=EC=A0=95=EC=9D=B8=EC=A7=80=20?= =?UTF-8?q?=EA=B5=AC=EB=B6=84=ED=95=98=EC=97=AC=20alert=EC=B0=BD=20?= =?UTF-8?q?=EB=9D=84=EC=9A=B0=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/components/counter.js | 121 +++++++++++++++++++++-- 1 file changed, 115 insertions(+), 6 deletions(-) diff --git a/week2/todomate/src/components/counter.js b/week2/todomate/src/components/counter.js index 57e9c20..7b3a584 100644 --- a/week2/todomate/src/components/counter.js +++ b/week2/todomate/src/components/counter.js @@ -29,13 +29,122 @@ function addTodo() { let id = clicked_header.getAttribute("id"); let tab = document.querySelector(`#${id}`); - tab.innerHTML += ` -
  • - - -

    ${input}

    -
    • + const array = []; + const data = { + calendar: [ + { + id: 0, + day: "월", + list: 7, + date: 3, + }, + { + id: 1, + day: "화", + list: 8, + date: 4, + }, + + { + id: 2, + day: "수", + list: 6, + date: 5, + }, + + { + id: 3, + day: "목", + list: 6, + date: 6, + }, + + { + id: 4, + day: "금", + list: 7, + date: 7, + }, + + { + id: 5, + day: "토", + list: 25, + date: 8, + }, + + { + id: 6, + day: "일", + list: 10, + date: 9, + }, + ], + lists: [ + { + id: 0, + header: "SOPT", + todos: ["해삐🌼웹팟 세미나", "금잔디 코드리뷰", "아티클스터디 아티클", "js스터디 아티클", "Track1 개발"], + }, + { + id: 1, + header: "CAU", + todos: ["한자 문제 제작 과제", "한자 필사 과제", "강의 수강"], + }, + { + id: 2, + header: "ROUTINE", + todos: ["필라테스", "독서", "1일1커밋"], + }, + { + id: 3, + header: "ETC", + todos: ["마스크 주문하기", "당근 택배부치기"], + }, + { + id: 4, + header: "FRIENDS", + todos: [ + "버즈 생일 챙기기", + "우디 생일 챙기기", + "제시 생일 챙기기", + "Track1 릴리즈 기념 인형 만들기", + "보핍 안부 인사", + ], + }, + { + id: 5, + header: "CLEAN", + todos: ["청소", "빨래", "환기"], + }, + { + id: 6, + header: "MEETING", + todos: ["스타트업 서핑 킥오프", "Track1 코어타임"], + }, + { + id: 7, + header: "PLAY", + todos: ["노래듣기", "더 글로리 보기"], + }, + ], + }; + + data.lists.map(({ todos }) => array.push(...todos)); + + console.log(array); + + if (!array.includes(input)) { + tab.innerHTML += ` +
  • + + +

    ${input}

    +
    • `; + } else { + alert("이미 있는 일정입니다"); + } let input_tag = document.querySelector("input"); input_tag.value = ""; From 77847503d06c89d79de88d87b7fb0dbe7c49d271 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Tue, 13 Jun 2023 00:44:58 +0900 Subject: [PATCH 12/12] =?UTF-8?q?[=20etc=20]=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=EC=BD=94=EB=93=9C=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- week2/todomate/src/components/counter.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/week2/todomate/src/components/counter.js b/week2/todomate/src/components/counter.js index 7b3a584..14ed059 100644 --- a/week2/todomate/src/components/counter.js +++ b/week2/todomate/src/components/counter.js @@ -132,8 +132,6 @@ function addTodo() { data.lists.map(({ todos }) => array.push(...todos)); - console.log(array); - if (!array.includes(input)) { tab.innerHTML += `