일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- 알고리즘
- JavaScript
- 프로그래머스
- 배열 중복 제거
- 숫자를 별점으로
- 로딩 후 실행
- NextJS v13
- 그리디
- 동전 0
- 중복선택
- 실전프로젝트
- 탐욕알고리즘
- server component
- 항해99솔직후기
- 자바스크립트
- 백준
- 부트캠프항해
- 중복카테고리
- 클라이언트 컴포넌트
- 항해99후기
- 배열 메소드
- 항해99추천
- 서버 컴포넌트
- 카테고리필터
- db수정
- 날씨 api
- 항해99
- react
- jQuery
- greedy
- Today
- Total
목록react (2)
공부 및 일상기록

Side프로젝트로 진행하는 방탈출 관련 웹페이지를 만들고 있다. 오늘은 방탈출 테마들을 여러가지 카테고리를 받아서 해당하는 테마만 필터링 하는 기능을 만들었다. 아직 백엔드쪽에서 서버도 구현되지 않고 API 명세서도 확실하지 않아서 기능만 구현된 상태다. 여기서 한가지만 선택한다면 쉽게 구현되었겠지만 나는 중복 선택을 가능하도록 만들어야 했다. 버튼컴포넌트 먼저 저 버튼들을 만들어줄 컴포넌트를 만들었다. //버튼 컴포넌트 import { useEffect } from "react"; import styled from "styled-components"; const CategoryBtn = ({ categoryIndex, state, setState }) => { useEffect(() => { if (s..

useState 연습의 아주 기초내용이므로 먼저 스스로 코드를 작성해 본 후 아래 내용 참고하시면 실력향상에 더욱 효과적 입니다. import React, { useState } from 'react'; const App = () => { const [number, setNumber] = useState(0);//기본값은 0으로 설정했다. const plus = () => {//plus 함수에 setNumber로 number를 받아서 +1을 함 setNumber(number + 1) }; const minus = () => {//minus 함수에 setNumber로 number를 받아서 -1을 함 setNumber(number - 1) }; return ( {number} +1//onClick에 plus..