이 프로젝트는 프로토타입으로 제작되어 기능에 초점을 두고 개발하였습니다. 이번 프로젝트 설명엔 자세한 코드설명이 들어가지 않습니다. 의뢰를 받고 제작중인 프로젝트라 코드를 개방적으로 보여줄 수 없습니다. 개발기간 : 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 알고리즘..
Figma Created with Figma www.figma.com 위 피그마 디자인을 퍼블리싱했습니다. 개발 포인트 1. input 태그의 invalid,valid,focus 효과주기 const Status = styled.div` height: 10px; width: 10px; background: #9d9d9d; border-radius: 10px; margin-left: 1rem; ${StyledInput}:invalid + & { background: #fe2f75; } ${StyledInput}:focus + & { background: #ffa689; } ${StyledInput}:valid + & { background: #70edb9; } `; 4개의 input태그 오른쪽에 있는 빨간점..
피그마 community에서 본 dashboard 디자인을 리액트로 퍼블리싱했습니다. 개발 포인트는 네비게이션바 아래 오른쪽에 위치한 테마 변경 버튼과 active deposits와 closed deposits를 하나의 컴포넌트로 작성후 재사용했다는 것입니다. 그리고 내부 요소들 또한 하나의 컴포넌트로 만들어졌고 모두 재사용되었습니다. 깃허브 저장소 : https://github.com/jdy0120/frontendproject/tree/master/depositespage GitHub - jdy0120/frontendproject Contribute to jdy0120/frontendproject development by creating an account on GitHub. github.com ac..
Figma Created with Figma www.figma.com 피그마 디자인을 리액트로 퍼블리싱한 작업입니다. 깃허브 저장소 : https://github.com/jdy0120/frontendproject/tree/master/figmatoreact GitHub - jdy0120/frontendproject Contribute to jdy0120/frontendproject development by creating an account on GitHub. github.com 퍼블리싱 완성 Tilte를 이용해 움직이는 아이콘을 구현했습니다. import styled from "styled-components"; import Tilt from "react-tilt"; const TiltWrapper ..
