프로젝트

프로젝트

[리액트 따라하며 배우기] 스도쿠 프로젝트 1편

오래전부터 개인적으로 만들고 싶은 게임을 만들어 봤습니다. 이번 영상은 스도쿠의 틀을 만드는 영상입니다. 버튼을 누르면 아래 숫자를 선택할 수 있는 모달이 나오고 숫자를 클릭하면 해당 칸의 숫자가 변합니다. 스도쿠의 특징인 9x9의 숫자 칸을 만들었고 이 칸을 9개로 나눠 노란색 선으로 구분지었습니다. .container { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; } .boxContainer { display: grid; grid-template-columns: repeat(9, 1fr); } 각각의 숫자 칸들은 grid를 통해 나눠져 있으며 한 행에 9개의 열이 있..

프로젝트

간단한 로그인 프로젝트 (redux-toolkit, sessiontStorage)

이번 리따배 프로젝트는 react+typescript를 이용한 로그인 프로젝트입니다. id: admin pw: admin 으로 로그인하면 main페이지로 이동합니다. 만약 로그인을 안한 상태로 main page로 이동을 한다면 sessionStorage에서 isLoggedin이 false인 상태이므로 모자이크 된 화면으로 보입니다. 보통 로그인하지 않은 유저가 유효한 페이지로 이동할 경우 login page로 리다이렉트 시켜 main페이지로의 이동을 막지만 잡플래닛에서 로그인 하지 않은 사용자의 리뷰 서칭을 막는 화면을 보고 따라 만들어봤습니다. 하지만 위 프로젝트의 문제는 main페이지에서 개발자도구로 들어가 모자이크를 해주는 css를 없애면 본문이 보인다는 것 입니다. 이는 로그인 하지 않은 사용자는..

프로젝트

소셜미디어 프로젝트 도연피디아

개발환경 - mac, vscode - language : typescript - framework: react,node - database : mongodb - library : mongoose,express,jwt,bcrypt 등 깃허브 레파지토리 : https://github.com/jdy0120/doyeonpedia GitHub - jdy0120/doyeonpedia Contribute to jdy0120/doyeonpedia development by creating an account on GitHub. github.com 인스타그램같은 소셜 서비스를 만들기 위해 시작했습니다. full stack으로 개발을 진행했으며 front-end : react back-end : node database ..

프로젝트

운동 선수 순위권 출력 프로젝트

이 프로젝트는 프로토타입으로 제작되어 기능에 초점을 두고 개발하였습니다. 이번 프로젝트 설명엔 자세한 코드설명이 들어가지 않습니다. 의뢰를 받고 제작중인 프로젝트라 코드를 개방적으로 보여줄 수 없습니다. 개발기간 : 2022-11-15 ~ 진행중 language : TypeScript font-end : React back-end : node database: mysql2 deploy : git-pages, firebase function 체육대회에서 배드민턴종목 중 선수들의 정보와 선수들의 대결 기록을 통해 순위권을 예측해주는 것이 프로젝트의 목적입니다. 순위권은 page-rank알고리즘과 deep-learning을 기반으로 정하게됩니다. page-rank알고리즘은 nba선수 page-rank 알고리즘..

개발자 도여니즘
'프로젝트' 카테고리의 글 목록