코딩기록

import {Table, TableHeader, TableColumn, TableBody, TableRow, TableCell} from "@nextui-org/react"; nextui에서 가져온 코드이고 설치도 잘 되어있는데 자꾸 형식 선언을 찾을 수 없다는 오류가 나와서 문제를 계속 찾았다. 어이없게 vscode 껐다 키니 해결... https://nextui.org/ NextUI - Beautiful, fast and modern React UI Library Beautiful, fast and modern React UI Library nextui.org

https://vercel.com/ Vercel: Build and deploy the best Web experiences with The Frontend Cloud – Vercel Vercel's Frontend Cloud gives developers the frameworks, workflows, and infrastructure to build a faster, more personalized Web. vercel.com 사전작업: 깃허브에 프로젝트 올리기 packga.json script에 build, start 추가 → push 코드 보기 "scripts": { "dev": "next dev", "build": "next build", "start": "next start" }, vercel..

📂폴더구조 더보기 💡 layout, not-found는 전 페이지에 공통적으로 적용되는 것이기 때문에 app 폴더 안에 위치해야함 각 폴더마다 적용되는 layout을 따로 만들 수 있음. 라우터 폴더를 따로 생성하고 싶으면 (괄호) 안으로 더보기 💡 metadata를 각 페이지마다 다르게 적용 가능함. https://nomadcoders.co/nextjs-for-beginners NextJS 14 시작하기 – 노마드 코더 Nomad Coders NextJS 14 For Beginners nomadcoders.co

html WWW.CHARTJS3.COM (Chart JS ) 모달 헤더 body close css .bar_modal { z-index: 10; position: fixed; margin: 0; padding: 0; left: 0; top: 0; height: 100vh; width: 100%; background: rgba(0,0,0,0.3); transition: opacity .2s; } .bar_modal.hide { opacity: 0; z-index: -10; } .modal { background: #fff; width: 300px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: ce..

링크에서 조금만 바꿨음 x라벨 위치값 찾았으니까 툴팁도 나오게 할 수 있을 것 같아서 바꿔 봄 html css .chartBox { width: 700px; position: relative; border-radius: 20px; border: solid 3px rgba(54, 162, 235, 1); background: white; } .x_label_tooltip { display: none; position: absolute; bottom: -20px; background:#fff; border: 1px solid red; } .x_label_tooltip.active { display: block; } const data = { labels: ['Mon', 'Tue', 'Wed', 'Thu', ..

https://www.youtube.com/watch?v=HCLkAlm9lPI const data = { labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], labelsLink: [ 'https://www.chartjs4.com', 'https://www.naver.com', 'https://www.google.com', 'https://www.chartjs4.com', 'https://www.google.com', 'https://www.naver.com', 'https://www.google.com', ], datasets: [{ label: 'Weekly Sales', data: [18, 12, 6, 9, 12, 3, 9], backgroundC..

연말이라고 바쁜 건 아닌데 어쩌다 바쁨...? 그래서 시간 날때마다 틈틈히 공부중입니다.. 다음엔 후기로 찾아올 수 있길..

- 타입 스크립트는 타입을 정확히! 명시해주어야함. - string, number, boolean, null, undefined ...등 만약 이런 객체를 써야한다면? let data:Restaurant = { name: '식당', category: 'western', address: { city: 'incheon', detail: 'somewhere', zipCode: 123123 }, menu:[ { name: 'rose pasta', price:2000, category: 'pasta' }, { name: '갈릭', price:2000, category: '스테이크' } ] } Restaurant.ts 새 페이지로 만들어서 객체마다 타입을 명시해주고 address와 menu같은 경우엔 새로운 타입을..

제목이 굉장히 길어졌지만 내가 보려고 남기는 자바스크립트 1. 문자열 메소드 *indexOf, includes function hasCola(str) { if (str.indexOf("콜라") > -1) { console.log("금칙어가 있습니다."); } else { console.log("통과"); } } function hasCola(str) { if (str.includes("콜라")) { console.log("금칙어가 있습니다."); } else { console.log("통과"); } } hasCola("사이다가 짱"); //통과 hasCola("콜라가 최고"); //금칙어가 있습니다. hasCola("콜라"); //금칙어가 있습니다. - "콜라"가 있으면 0보다 크고 "콜라"가 없으면 -..

*생성자 함수 function Item(title, price) { // this = {}; this.title = title; this.price = price; this.showPrice = function() { console.log(`가격은 ${price}원 입니다.`); } //return this; } //new를 안붙이면 그냥 함수실행 const item1 = new Item('인형', 1000); const item2 = new Item('인형2', 2000); const item3 = new Item('인형3', 3000); item3.showPrice(); // => 가격은 3000원 입니다. - 생성자 함수를 사용하면 주석으로 돌린 코드와 같이 실행됨. - new를 안붙이면 그냥 함수..