Dev_log 프로젝트 시작..혼돈의 세팅

@glassestae·2020년 6월 4일
0

Dev

목록 보기
3/3

어제 엊그제 팀원분들과 기획 회의,설계를 진행하고 오늘 오후 부터
프로젝트 폴더 초기 세팅을 진행했다.
폴더 디렉토리 구조,리액트 네이티브,expo,리덕스 셋팅까지 끝냈다.

디렉토리 구조

── src
   ├── components    
   ├── hooks
   ├── core
   │   ├── api     
   │   └──  utils   
   │   
   ├── types
   ├── pages  
   ├── static 
   ├── store  
   │   ├── module 
   │   │   ├── index.ts
   │   │   └── ....modules
   │   └── index.ts
   └── styles 

해당 글을 참고해서 디렉토리 구조를 짰습니다.
위 글의 토대를 그대로 가져오고

프리젠테이셔널 컴포넌트 방식 대신에 훅스로 리듀서와 연결해주는 방법을 선택했기때문에 컨테이너 위치를 훅스로 대신 했다.

리액트 네이티브 흑흑..

하.. 일단은 이름이 리액트 네이티브 니까 리액트랑 크게 안다르겠찌~ 하고 마음 놓고 있었던게 후회된다 ...
생각보다 많이 다르고 세팅해야 할것도 많았다...

대망의 좌절은 폰트 설정이었는데 커스텀 폰트 적용이 어마어마했다.
웹처럼 그냥 css나 html에 넣는 방식이 아니라 당황했다.

useEffect(() => {
  //폰트를 불러오는 async/await함수 
  //IIFE 방식으로 사용
    (async function () {
      const custumFont = {
        NMedium: require("./assets/fonts/NotoSansKR-Medium.otf"),
        NBold: require("./assets/fonts/NotoSansKR-Bold.otf"),
        NRegular: require("./assets/fonts/NotoSansKR-Regular.otf"),
      };
      
      await Font.loadAsync(custumFont);
      setReady(true);
    })();
  
  }, []);

이런식으로 assets에 위치시킨 폰트 자체를
loadAsync라는 함수 자체로 읽어와야 했다.

profile
프론트엔드 디벨로퍼 지망 :D

0개의 댓글