---
# System prepended metadata

title: Dev Answer

---

# Dev Answer

## logo

Montserrat - 800
#270949
107px


# 그라운드룰
1. 작업 전

2. 작업 중
- pr
- commit(루즈하게~ : 누가 이해할 수 있기만 하면 됨)

feat: 기능 구현함
test: 컴포넌트 테스트를 한다
fix: 버그 고침
refactor: 리팩터링함
style: 스타일 작업함
chore: 패키지 및 기타
docs: 문서작업


PR - template
Issue - template
wiki - NoNo

master - develop - (개인 branch : Merge시 자동으로 삭제)

1주일 안에 리뷰 안하면, 그냥 Approve (-3%)
25% 씩



3. 작업 후
- approve(3명)





0. SKill
(0) 협업툴
- 프로토타입핑 : 제플린


(1) FE

- **React**
- **TypeScript**
- GraphQL(Relay) vs Recoil, Redux-toolkit  : Relay 공부 후 상태 관리 라이브러리 정하기
- **stitches**
- **webpack**
- **babel**
- **eslint**
- **React testing library**
- **jest**
- **codeceptjs**

SWR, React Query 

(2) BE

- SSR(Next.js)
- Node + Express + Apollo Server
- Node + (Express/?) + Prisma2
 
(3) Infra
- Server : **EC2**
- DB(RDBMS) : **MySQL
- CI/CD : **GitHub Action**
- yarn > npm
- 모노레포? mono(1) repo(레포) 러너? runner? 

1. 프로토타이핑
2. FE 아키텍쳐 + 구글애널리틱스 + 서치콘솔 + 개발환경설정
3. BE 아키텍쳐 + 인프라 구축 + 개발환경설정
4. 문서화 틀 



그라운드룰 (3명 - approve)
     1지망 2지망
다희: 4
인서: 3
우민: 2
기봉: 1


(4) 웹 컨셉
- 모바일 first
- 반응형



1. 프로젝트 또는 서비스 이름

```
풍덩
we can do
개발자들
기억보단 기록을
Exit보다 구직을
백수보다 구직을
모두개발
프론트엔드 개발자라면 알아야할 101가지
개발시장에서 살아남기 시리즈
Dev 
I can't, we can
프론트엔드 개발자 핸드북
Git pull quiz
we can? on weekend
We Can Do, Oh Weekend
개발 면(접)치기
```

2. 기획

(1) 콘텐츠

0) Reference

    - 한재엽님 repo
    - 전우민님 "오늘의 문제"

1) 웹

2) HTML

3) CSS

4) JavaScript

5) React

(2) 가치
- 1) 신입 2) 프론트엔드 개발자가 3) 면접 준비에 유용한 문제를 4) 퀴즈 형식으로 제공

(3) 페이지 및 페이지별 기능
1) 메인 페이지
**카드뷰**
    - 카테고리(JS, HTML, CSS, All, Random, 난이도별, 추천순 등)별로 나누고
    - 해결한 문제수/총 문제수

필터링 -> 카테고리 -> 난이도

ㅁ ㅁ ㅁ
ㅁ ㅁ ㅁ

2) 문제 보여주는 페이지
**문제**
- 문제
[예시]
Q. 대한민국의 수도는?
V 답안 보기 > 다음문제로 넘어가기
답안들 +1 -100
문제 제공자 : XXX
[ 나의 답변 작성란(선택)                   ]


- 며칠 전에 풀었는지(개인화)
- 푼 문제인지 아닌지
- 문제 난이도(별점 또는 상/중/하) : 유저참여형
- 문제 추천하기

즐겨찾기 기능


답안 보기 버튼(추천 수 많은 순)
- 최초 유저(이태원 4인) + 다른 유저 답안 보여주기
- 다른 유저 답안에 대한 추천/비추천

다음 문제로 넘어가기 버튼

나만의 답변 작성하기(선택) 버튼
문제 제공자(GitHub URL): 

- 작성하기 기능 빼기
- 제출/공유 하기

- 디렉토리 구조 잡아놓고 한명이 피쳐

(디자인+기획)2 vs (서버)2
- query: 추상화?
- 

3) 문제 완료 페이지
- 


3. 벤치마킹 할 사이트
- 코딩도장 : https://codingdojang.com/
- Okky : https://okky.kr/articles/community
- 개발자 커뮤니티 모음 : https://sharply.tistory.com/975

