우아한 테크러닝 4기 - 두번째 수업(목표 설정, 라이브러리 선택 기준)

과제 확인

 

React + Typescript 로 생성한 레포를 슬랙에 공유하는게 과제였다.

 

30명 이상이 슬랙에 레포를 공유했는데 그에 대한 리뷰를 해주셨다.

 

대부분 create-react-app을 사용한 레포를 올렸는데 그게 조금 아쉬우셨던 것 같다.

 

한 분이 babel, webpack을 사용한 레포를 소개해 주셨고,

 

그 레포로 이후에 프로젝트를 진행하기로 했다.

 

 

 

이사님 리뷰

 

목표를 구체화 한 레포가 없고,

 

README에 어느 정도의 기획을 해왔을 것이라 생각했는데

 

그런 사람이 없었다라는 말씀을 하셨다.

 

그것은 소통의 부재 때문이고

 

우리가 목표를 정확하게 설정하지 않고 지난 수업을 끝냈기 때문이라면서

 

앞으로는 궁금한 것에 대한 질문을 편하게 했으면 좋겠다고 하셨다.

 

나도 하나씩은 꼭 질문을 하도록 노력하려고 한다!!!! 화이띵!!!!!!

 

 

 

 

오늘의 목표

 

이 전 수없에서 목표가 많이 부족하다고 느꼈기 때문에

 

오늘 수업의 목표를 미리 말씀해 주셨다.

 

 

1. 프로토타입을 만들어 봐야할 것들을 도출해내는 것

2. 노션이랑 얼마나 같은 것을 만들지 스펙을 정하는 것

 

 

 

 

 

기능

 

우선 스펙부터 정했다.

 

기간이 짧은만큼 완벽하게 노션이랑 똑같은 기능을 하는 것을 만들 수는 없을 것 같기 때문에

 

어느정도의 기능을 만들지 정했다??기 보다는 말씀해주셨다.

 

1. 구글 로그인

2. 로그인 정보를 백엔드에 저장한다면 db, 세션유지 기능이 있어야함

3. 마크다운 기반의 문서를 만드는것

4. 폴더 형태로 문서를 만들면 너무 복잡해 질 것이라 예상해서 단일 문서 형태로 결정

5. 친구들끼리만 공유하는 간단한 문서 공유 서비스

 

 

 

 

 

라이브러리/프레임워크 결정 과정

 

레포를 제공해주신 분이 TOASTUI라는 에디터 라이브러리를 사용하면 좋겠다고 하셨었다.

 

그래서 다같이 그 라이브러리에 대해서 알아보는 시간을 가진 후에 

 

우리 프로젝트에 어울릴만한 라이브러리인지를 이야기해보기로 했다.

 

https://ui.toast.com/

TOAST UI :: Make Your Web Delicious! | TOAST UI :: Make Your Web Delicious!

나는 우선 UI라이브러리를 많이 사용해본적이 없었고, react.js 도 기본의 기본만 아는 상태이기 때문에

 

어떤식으로 이 라이브러리를 봐야할지 감이 잡히지 않았다.

 

그래도 우선은 내 생각을 정리해봤다.

 

 

내 생각

• javascript기반의 라이브러리인데, react는 wrapper을 깔아서 사용할 수 있어서 큰 문제가 없을 것으로 생각했다.
• 커스터마이징은 예시를 봤더니 잘 안될 구조였다.
• editor 패키지만 설치해서 사용하고 필요에 따라 다른 플러그인들을 설치할 수 있어서 패키지 규모를 조절 할 수 있을 것이라 생각했다.

 

결론은 우리가 에디터 자체를 만드는 데 초점을 두지 않는 다면 사용해도 될 것 같다고 생각했다.

플러그인도 잘 제공하고 있어서 다른 기능을 확장하는데도 좋을 것이라 생각했다.

 

 

 

이사님과 발표해주신 다른 분들의 의견

 

• 올인원 라이브러리라서 모든 기능을 한꺼번에 다운 받아야 한다.
• 쓸모없는 기능들 까지 다 받아야한다.
• 라이브러리가 제공하지 않는 UI를 생성하려면 어떻게 해야할 지 봤지만(createPlugin) 커스텀이 잘 안될 것 같다는 생각이 들어서 우리의 목표에 부합하지 않는 것 같다고 하셨다.

 

에디터에 기본적으로 기능이 많긴 했지만 나는 에디터를 만드는 것 보다는 다른 기능들에 집중하고 싶어서 저런 생각을 했었지만 커스터마이징이 쉽지 않을 것이라는 것이 라이브러리 선택에서는 아주아주 중요한 부분인 것 같다!!

 

 

 

결론적으로 다른 프레임 워크를 민태님께서 추천해주셨다.

• draft.js
• slate.js

 

 

 

 

과제 

 

1. 구글 로그인 연결해보기

2. 프로토타이핑 해보기 (slate.js, draft.js) - 간단하게 코드 샌드박스로 만들어보기 (어떤 프레임워크를 사용할 지 결정의 용도)

 

 

 

 

 

그 외에 적어놓고 싶은 것들

 

질문을 충분히 이해하지 못했다고 생각한다면 다시 질문하기(소통이 된다는 의미로 보임)

 

프론트와 서버를 분리하지 않으면 브랜치 전략도 복잡해진다. (혼자 프로젝트를 하면서도 느꼇던 부분)

 

기술 선택 과정

• 개발적으로 어떤 것을 생각해야할까?
• 구현 가능성 검토
• 라이브러리를 선택할 때 기준 (지속적으로 관리되는 라이브러리인지? 라이브러리를 커스터마이징 할 수 있는지? 아니면 직접 개발을 할지?)
• 문제를 효과적으로 해결하는 것에 중점을 둬야함
• 항상 당위성이 필요하고 내가 사용하는 기술에 대한 장단점을 나열할 정도는 돼야한다.

 

다른 사람에게 설명하지 못하는 지식은 지식이 아니다.