| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 | 29 | 30 | 31 |
- error
- froggy
- flexbox/grid 적용 여부
- 조건부 스타일링
- flexbox
- 정보처리기사실기
- flex container
- login button 컴포넌트
- github
- 프로그래머스
- 카카오맵
- justify-content: center;
- 기사퍼스트
- createstore 취소선
- flex item
- position
- Flexbox Froggy
- react 상태 관리 라이브러리
- 정보처리기사
- git revert
- JWT
- input 컴포넌트
- prettier
- 테스트 코드
- 모듈 관리
- Redux
- 정보처리기사필기
- 홍달쌤
- 백준
- REACT
- Today
- Total
목록모듈 관리 (2)
minyoung
공통 컴포넌트 - NicknameInput
공통 컴포넌트 NicknameInput 개발 과정NicknameInput 컴포넌트 구현src/components/common/NicknameInput.jsximport styled from "styled-components";const NicknameInput = ({ type, placeholder, value, onChange, status }) => { return ( );};const Input = styled.input` background-color: transparent; // 기본 배경색 제거 (투명하게 설정) border: none; // 기본 테두리 제거 outline: none; // 클릭했을 때 outline 제거 width: 350px..
공통 컴포넌트 개발 - 로그인 버튼
공통 컴포넌트, 로그인 버튼 개발 과정디자이너분께 Login/Join 파트의 모바일 디자인을 적응형에서 반응형으로 수정 요청을 드렸고, 수정될 때까지 지금 당장 할 수 있는 공통 컴포넌트를 먼저 개발하기로 했다.FE 3명으로 구성된 우리 팀은 역할을 나눠 개발에 들어갔다.LoginButton 초기 디자인은 왼쪽 사진과 같았으나, 디자이너분이 오른쪽 사진으로 수정하셨고, 코드도 수정해서 PR 했다.수정한 코드를 통해 공통 컴포넌트 개발을 어떻게 진행했는지 간단하게 기록한다.LoginButton 컴포넌트 구현src/components/common/LoginButton.jsx 'LoginButton.jsx' 는 다양한 플랫폼(카카오, 네이버, 구글)에 맞춘 로그인 버튼을 제공하는 재사용 가능한 React 컴포..