분류 전체보기(91)
-
24/1/12 기술면접
상태관리를 왜 할까요? 그리고 평소 state 관리는 어떻게 하시나요? 답변 state props LifeCycle dom redux react-query 리액트는 SPA(싱글 페이지 어플리케이션)이니까 스테이트 변화를 주면 그에따라 변화를 읽고 화면을 리랜더링 시켜주기위해서 상태관리는 해야합니다. 지역적으로 한파일 안에서의 state관리만 할꺼면 useState나 useRef정도 더넘어서 useReducer 정도만 이용해도 충분합니다. 만약 부모컴포넌트나 자식컴포넌트가 있는데 그들에게 상태변화를 연결해주고 싶으면 최상단 부모태그에 상태관리를 위한 useState같은것들을 주고 그에 따른 필요한 로직들을 props로 전달하면 됩니다. LifeCycle? - 라이프 사이클은 컴포넌트가 mount될때 유지되..
2024.01.12 -
24/1/11 스피드게임(speed Game)
팀원이 만들어주신 스피드게임 코드분석 import React from "react"; import OneToFifty from "../components/speedGame/OneToFifty"; const SpeedGamePage = () => { return ( //요 컴포넌트 하나만 있구먼 흠흠 ); }; export default SpeedGamePage; import React, { useState, useRef } from "react"; //유즈레프랑 유즈 스테이트를 사용하실건가보넹 import styled from "styled-components"; import Board from "./Board"; //요거랑 밑에꺼는 컴포넌트인거 같고 import Timer from "./Timer"; ..
2024.01.12 -
24/1/9 반응속도 게임(response check)
이건 내가 만든 게임은 아니다 ㅋㅋㅋㅋ 팀원 코드인데 훑어봅시다. 허락안맡고 올리는중 ㅋㅋㅋ til쓸게 없어용 ㅜ import React, { useState, useRef, useCallback } from "react"; import { StContainer, //우리 팀원분 깔끔한 성격이라 스타일드 컴포넌트 다 파일 분리하셨음 Stscreen, StText, StTime, StContent, StBtn, } from "./style"; const ResponseCheck = () => { const [state, setState] = useState("waiting"); const [message, setMessage] = useState("클릭해서 시작하세요 !"); //흐음 유즈스테이트 3개 c..
2024.01.10 -
24/1/8 메모리카드 게임
import React from "react"; import MemoryCard from "../components/memocard/MemoryCard"; export default function MemoryCardPage() { return ( ); } import React, { useEffect, useState } from "react"; //메모리카드는 한쌍의 두장으로 총 16개의 카드가 나온다. import phi from "../../assets/images/phi.jpg"; import Mu from "../../assets/images/mu.jpg"; import ggo from "../../assets/images/ggo.jpg"; import pha from "../../assets..
2024.01.09 -
24/1/5 tic tac toe( 틱택토 )
import React from "react"; import TicTacToeGame from "../components/TicTacToe/TicTacToeGame"; export default function TicTacToe() { return ( ); } import React, { useRef, useState } from "react"; import circle from "../../assets/images/circle.png"; import cross from "../../assets/images/cross.png"; import styled from "styled-components"; let data = ["", "", "", "", "", "", "", "", ""]; //틱택토 ox가 ..
2024.01.08 -
24/1/4 최종 팀프로젝트 S.A
S.A 주제 : 선행, 절약 카테고리: 음식, 미용업, 숙박업 API : 착한가격업소API, 지도 API 행정안전부_착한가격업소 현황_20230428 사장님 감사합니다, 착한 나라, 착한 사장님, 천사 식당, 따뜻한 한끼, 라이킷, 라이스, 돈워리, 싼밥, 파란식당, 이웃식당, 따식, 한끼줍쇼, 키다리 식당, 배부른지갑, 돈을 줄이는 꿀팁 - 돈꿀, 지역상인과 소비자가 윈윈 이유있는 식당, 모두의 음식점 = 모음, 따뜻한 음식점 = 따음, 따뜻한 음식을 불어 먹는 or 웃음이 지어지는 식당 = 호호, 프로젝트명 프로젝트 소개 한 줄 정리 : 행정안전부의 착한가격업소 API와 카카오 위치 API를 이용하여 이용자들의 위치에 따라 착한가격업소의 정보를 제공하며, 식당의 간략한 평가와 커뮤니티를 통해 소비자들..
2024.01.04