10/29 수업내용

Ahn·2021년 10월 29일
0

$ npx react-native start

$ npx react-native run-android


<View> div같은거

react-native에서 제공하는 태그들을 쓸 수 있음

View , useColorScheme , Text , StyleSheet .....

기존엔 react와 next를 같이 썼지만

네이티브를 쓸땐 react와 네이티브를 써야함

react-native-webview

https://www.npmjs.com/package/react-native-webview

$ yarn add react-native-webview
설치해주고

App.js에 이렇게 바꿔주고

$ npx react-native run-android 다시 실행시켜주면

화면이 잘 뜬다.


npx는 무엇인가

yarn으로 깔게되면 계속 용량을 차지함

잠깐 설치해서 조금만쓰고 그 다음부터 안쓰는것들을
용량을 쓸데없이 차지하게 되는데,

잠깐 설치하고 , 명령이 실행되고나서 바로 지워지는게
npx임 예를 들어서 npx react-native run-android를 실행시키고
바로 지움.

잠깐 설치해서 조금만쓰고 지울거는 npx로 깔면 됨.

react-native 사이트에서도 npx로 설치하라고 권장되어있음.


android package(apk)파일 만들기

$ npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/
이명령어를 쳐서 에러가 난다면

android / app / src / main 에 assets라는 폴더를 만들고

그리고나서 다시 위에있는 명령어를 치면

에셋폴더안에 번들이 생김

그리고나서 다시 실행시켜줘야함
$ npx react-native run-android

android / app / build / outputs / apk / debug
안에 apk파일이 하나 생김 (app-debug.apk)

사실 npx react-native run-android를 실행시켜도 얘가 생기는데
처음 만들어진거가지고 배포는 불가능함.

근데 이렇게 만들고나서의 apk파일은 배포가 가능함

저 파일을 핸드폰으로 옮겨서 실행시키면 잘 실행되었음.


############

뢕트 네이티브를 추천하시는 이유?

react + next.js 를 배웠음.

react-native는 지금까지 배웠던 페이지 이동 방식이 다름.
네비게이션이라는걸 깔아서 그 룰을 따라야함.

순수 react도 페이지 이동 방식이 또 다름. --
react router라는걸로 함

이렇게 뭘 하든간에 환경에따라서 페이지 이동방식이 달라짐.
이런걸 다 할줄 안다면 , 웹과 앱사이에서 페이지 이동이 어떻게
이뤄지는가에 대한 , 뭐,.. cs적인 사고가 깊어져서 하면 좋다고 하심

그리고

회사에 드가면 내가 배우지 못한 기술을 뚫는 방법?
을 미리 경험하는 차원에서 좋다고 생각하심
(Docs보는 실력 ...)


rendering-engine을 이해하고 있으면 좋음

JS쓰레드: JS실행시키는 일꾼
실제로 JS code를 읽고

네이티브 브릿지가 메인일꾼(android)로 전달

그래서 작업속도가 느림.

js를 하나만 만들어서
브릿지가 안드로이드면 안드로이드로 보내고, ios면 ios로 보내기위해
저 과정을 거침.


PWA (Progressive web app)

"웹을 앱처럼 똑같이 만들 수 없을까?" 해서 나온거임.

PC웹 , 모바일웹 , 웹뷰 , 네이티브웹

모바일웹에다가 PWA라는걸 추가해주면
바로가기 아이콘이 생김. 클릭하면 바로 모바일웹으로 들어가짐

웹을 들어가려면 주소를 통해서 들어감
근데 앱은 아이콘을 눌러야 들어갈 수 있음.

그래서 편하게 쓸려면 앱을 다운받아서 드가야함.

앱은 사람들이 유명한거 아니면 잘 다운로드 안받음
그래서 광고비용이 높음.

푸쉬알림이 핸드폰에서만 받을 수 있는 기능이였는데,
PWA를 쓰면 받을 수 있음.


$ yarn dev -p 3001
refreshToken을 못받음 3000포트로만 주고 있어서


git workflow

git flow 검색하면 여러가지 방법이 많은데

featrue-boardWrite
feature-singup
feature-productWrite
.....

각각 브랜치를 만들어서 feature 브랜치에 push

그다음

각각의 작업내용(branch)들을 develop 브랜치로 합침

그리고 또 다른 기능을 만들고 싶다, 그러면
feature에서 만들고 develop에 합치면 됨.

정리 develop는 여러개를 합치는 곳

작업이 어느정도 끝났다 싶으면 release branch로 올림
여기서 버그같은걸 잡고,

최종적으로 문제가 없으면 master(main) 브랜치로 올리는거(배포)임

최근 master가 main으로 가는 추세임
둘 다 똑같음

hotfixes ???

문제없다고 넘어갔는데 버그가 생기면 고쳐서 다시 배포하는게 핫픽스임.

포킹 레파지토리?

회사계정을 가지고 있는 사람만 원본에 push 할 수 있음.

각자가 원본을 포크한걸 각자 컴퓨터에 clone함

그리고나서 피쳐브랜치에서 만들고 만들고 수정하고 수정함

그리고나서 클론한 포크 리포지터리에 push하고 원본 github에 pr(pull request)날림

그리고나서 회사계정을 가지고있는사람이 원본 깃허브에서 Pr된 내용을
합쳐야 진짜 원본 깃 리포지터리에 합쳐진거임.
보통 퇴근하기직전이나 , 다음날 아침에 합친다(merge).
회의를 통해서 Pr들을 가지고 합칠지 말지 논의해보고
문제없으면 올리고, 문제 있을거같으면 다시 수정해서 올리던가 함

pr을 reject할건 잘라버리고 , 나머진 살림
그리고나서 아침 회의끝나면 , 업데이트 된 내용을
자신의 로컬에서 pull해옴.

이걸 반복.......

중요한거

boardWrite , boardList를 같이 만들때
충돌 날 가능성이 큼 같은 board라는 영역을
만드는건 비추

board관련된 기능을 한사람이 만들면
다른 팀원이 다른 곳의 기능을 만드는게 좋음.

매일매일 코드를 짜서 만드는데 2~3일만에
커밋을해버리면 기존 코드와 충돌이 날 가능성이 큼.
1일 1커밋을 하는게 좋음

공통 컴포넌트(실무에선 회사에 없어선 안될 파일들) 같은건 시니어들이 맡아서 작업함


밑에 원본이 있음
forked rom nwd0907/codecamp-team-3

new Issues
내가 할 일을 여기다가 적음

내가 만든 이슈가 #13번이다 그러면
$ git checkout -b feature-issue-#13 이렇게 브랜치를 새로 만들고
변경사항을 여기서 만들고 git add commit

$ git remote add upstream 원본 깃허브 주소

push 할땐


commit 컨벤션

https://djkeh.github.io/articles/How-to-write-a-git-commit-message-kor/

회사 실무에서나, 오픈소스에 참여할때
개발자들끼리의 국룰인 깃 컨벤션을 지킨상태로 git에 커밋해줘야 함
안그럼 욕 먹음

profile
Hello~~👋

0개의 댓글