[RN] 앱을 만들어보자, React Native! - Navigation .02
Front-End/React Native Issue2022. 12. 12. 14:07[RN] 앱을 만들어보자, React Native! - Navigation .02

안녕하세요! RyuWoong입니다. 이번 이야기는 화면 전환과 설계에 관한 이야기 입니다. React Native(이하 RN)에서 든 Web에서든 빠질 수 없는 것이 Router 역할인데, RN에서는 Navigation을 사용합니다. 몇 개의 라이브러리가 있지만 저는 React Navigation을 주로 사용하기 때문에 해당 라이브러리 위주로 설명하겠습니다! Navigation의 종류 주로 사용하는 Navigation의 종류는 3개 정도로 아래와 같습니다. - Stack - Bottom Tab - Drawer 각 Navigation의 기본 적인 사용법은 라이브러리 홈페이지에 설명이 잘 되어 있어 생략합니다. 추가적인 질문이 있으시면 댓글로 남겨주세요. Stack Naviagtion 먼저 가장 메인이 되는..

[RN] 앱을 만들어보자, React Native! - 기본적인 Component .01
Front-End/React Native Issue2022. 12. 10. 20:43[RN] 앱을 만들어보자, React Native! - 기본적인 Component .01

안녕하세요! RyuWoong입니다. 포스팅이 조금 늦어졌습니다! 원래 Navigation을 포스팅하려다가 생각해보니까 기본적인 Component 이야기를 해야할 것 같아서, 새롭게 작성한다고 그만..! 그럼 본론으로 들어가도록 하죠. React Native(이하 RN)에서 View를 구성할 땐 Web과 다른 독자적인 Component를 사용합니다. 자! 그럼 어떤 Component들이 있는지 살펴 볼까요? 공식문서 내 여기서🙋 볼 수 있습니다. 깨알 같은 Tip도 많으니 도움이 됐으면 좋겠습니다. Components ActivityIndicator 로딩 시 빙글빙글 돌아가는 애니메이션을 보신 적 있을 겁니다. 그것을 만드는 컴포넌트입니다. 자주 보시죠? Button 버튼입니다. 하지만 실질적으로 거의 사..

[RN] 앱을 만들어보자, React Native! - 시작하기 앞서 .00
Front-End/React Native Issue2022. 11. 26. 22:16[RN] 앱을 만들어보자, React Native! - 시작하기 앞서 .00

안녕하세요! RyuWoong입니다. 제가 근 2년간 React Native를 다뤄왔는데요. React Native를 다루면서 익힌 여러가지 방법이나, 생각 등을 정리해보고자 합니다. React 생태계를 많이 사용하지만, Web과는 다른 부분 때문에 어떻게 처리해야 좋을지 마땅한 자료가 없어 어려움을 겪고 계신 분들이 제 글을 읽으시고 많은 도움이 되셨으면 좋겠네요. Why React Native? 먼저 React Native가 왜 핫한지 설명하자면, 기존에 AOS, iOS, (+ 웹, 데스크탑까지) 각각 다른 언어로 만들고 유지보수 한다는 것은 비용과 생산성 문제가 발생하게 됩니다. 이에 Meta(전 FaceBook)에서 React로 Native앱을 만들 수 있는 프레임워크인 React Native를 개..

[Express] TypeORM 다뤄보기 .03
Back-End/Express.js2022. 10. 9. 17:34[Express] TypeORM 다뤄보기 .03

안녕하세요! RyuWoong입니다. 이번에는 TypeORM을 한번 다뤄보도록 하겠습니다. 다뤄보시다보면 Query문 입력하는 것보다 훨씬 편리하다는 것을 느끼실 수 있을거라 생각합니다. 그럼 시작해볼까요? Entity Entity 생성하기 TypeORM에서 Entity로 데이터베이스 테이블을 Mapping 할 수 있습니다. 먼저 src폴더 내에 entity폴더를 생성한 후에, User Entity를 만들어 보도록 하겠습니다. idx와 id로 구성된 User Entity입니다. //src/entity/user.ts import { Column, Entity, PrimaryGeneratedColumn, } from 'typeorm'; @Entity() export default class User { @Pr..

[Express] TypeORM 연결하기 .02
Back-End/Express.js2022. 10. 3. 21:46[Express] TypeORM 연결하기 .02

안녕하세요! RyuWoong입니다. 정신 없던 프로젝트가 마무리가 되어가니 시간이 생기네요! 이번에는 TypeORM을 연결해보도록 하겠습니다. 가실까요?! TypeORM? TypeORM은 ORM 즉, 객체와 관계형 데이터베이스의 데이터를 자동으로 연결(맵핑) 해주는 라이브러리입니다. Express와 잘 사용하던 ORM 중에 Sequlize라는 라이브러리가 있습니다만, 우리는 TypeScript를 사용하고 있고, 향후 Nest를 사용하게 되면 TypeORM과의 궁합이 더 좋기 때문에 TypeORM을 사용하도록 하겠습니다. 특히 최근에 TypeORM이 3버전으로 올라오면서, 점점 발전하고 있는 라이브러리 입니다. 더보기 TypeORM은 클래스형태로 작성하게 되는데 저는 Entity선언부는 클래스형으로, 이외..

image