분류 전체보기(52)
-
[Final Project] 4주 프로젝트 회고
4주 프로젝트 회고 마지막 프로젝트를 진행했다. 기획부터 배포까지 총 4주간 진행했고, 그 과정에서 배운 것들을 정리해보려고 한다. A Week Trip 내일로 기반의 기차여행 계획 및 커뮤니티 앱 A Week Trip을 구현했다. 원래는 내일로 여행을 배경으로 삼은 앱이었는데, 프로젝트 도중에 내일로가 개편이 되는 바람에… 급하게 기차여행 앱으로 변경했다. A Week Trip의 주요 기능은 아래와 같다. 구글 / 페이스북 소셜로그인 및 로그아웃 추천 기차역 및 추천 코스 조회 기차역 검색 및 즐겨찾기 기차 노선도가 있는 지도 줌인 / 줌아웃 조회 날짜 / 일차별 계획 생성 게시글 생성 / 수정 / 편집 / 삭제 게시글 검색 게시글에 사진 첨부하기 게시글 스크랩 댓글 생성 / 수정 / 편집 / 삭제 내..
2020.08.13 -
리액트 네비게이션 screen focus 문제
리액트 네이티브로 프로젝트를 진행중인데, 화면 라우팅 용으로 리액트 네비게이션을 사용중이다. 단순 라우팅 이외에도 params를 화면간에 넘겨줄 수 있는 게 참 편리하다고 생각했고, 그 특징을 적극 활용해서 state를 루트 파일까지 끌어올리지 않고 바로바로 넘겨주며 사용하고 있다. (추후 리덕스로 리팩토링 예정이다.) 오늘도 navigation.navigate로 다음 페이지로 넘어가게 해주고, 동시에 params로 변수 몇 가지를 넘기는 부분을 작업했고, 그 후 넘어간 뒤의 스크린(넘어온 뒤의 스크린의 이전 스크린이다.) 에서 params로 받아 온 변수들을 여러 차례에 걸쳐서 합친 뒤 또 다른 스크린으로 넘겨주어야 했다. 그래서 대강 화면별 이동하는 데이터의 흐름은 아래와 같았다. (1, 2, 3번 ..
2020.07.27 -
React Naitive, Redux로 미니 투두앱 만들기
final 프로젝트 본격 구현 이전에 리액트 네이티브 연습겸 미니 프로젝트를 진행했다. 기술 스택은 기본적으로 react hooks, react native, react navigation, async storage를 사용했고, 리덕스 연습을 위해 리덕스 브랜치를 따서 추가적으로 redux, redux-persist를 사용했다. 연습하고자 했던 내용들은 아래와 같다. 1. 리액트 네이티브에서 하위 컴포넌트에 props 넘겨주기 2. 리액트 네이티브에서 반복문을 이용한 컴포넌트 렌더링 3. useEffect를 이용한 비동기 처리 (Async Storage에서 로그인 여부를 가져오는 데에 사용했다.) 4. 탭 / 스택 네비게이션을 nesting 해서 사용하기 5. 네비게이션 이동 시에 params를 넘겨주기..
2020.07.19 -
[First Project] 2주 프로젝트 회고
2주 프로젝트 회고 이번에 첫번째 프로젝트를 진행하게 되었다. 총 2주간 짧다면 짧은 시간동안 진행했는데, 그 과정에서 느꼈던 것들을 정리해보려고 한다. 색갈피 한국어로 된 컬러팔레트 웹사이트인 색갈피를 구현했다. 보통의 컬러팔레트 웹사이트는 영어로 된 사이트가 많아, 한국어로 된 컬러팔레트 사이트가 있으면 좋겠다는 아이디어로부터 출발했다. 색갈피의 주요 기능은 아래와 같다. 컬러팔레트 조회 컬러팔레트 생성 / 편집 컬러팔레트 삭제 컬러팔레트 공유 : 헥사코드, RGB코드, 이미지 저장, 링크 복사, 컬러코드 자동 복사 유저 회원가입 유저 로그인 / 로그아웃 유저 정보 수정 유저 삭제 맡은 역할 팀은 총 4명이었고, 프론트엔드 2명, 백엔드 2명으로 구성되었다. 나는 그 중에서도 프론트엔드를 맡아 작업했..
2020.07.12 -
React Hooks
프로젝트 진행하며 Hooks 설명을 위한 글입니다 # React Hook - 기존의 react에서는 class 컴포넌트 안에서만 state, lifecycle 메소드를 사용할 수 있었습니다. - 하지만 hooks가 도입되면서 function 컴포넌트 안에서도 state, lifecycle 메소드를 사용 가능하게 되었습니다. # useState - state를 정의하고, setState 메소드를 만들 때 사용합니다. - useState는 인자로 state의 초기값을 받습니다. - useState의 반환값은 생성된 새 state 변수와, 해당 state 전용 state 변경 함수의 쌍입니다. import React, { useState } from 'react'; const App = () => { cons..
2020.07.02 -
200623 TIL :: AWS
# AWS - 아마존에서 제공하는 클라우드 컴퓨팅 서비스 ## 클라우드 컴퓨팅 - 인터넷을 통해 통해 가상화된 컴퓨터의 IT 리소스와 애플리케이션 등을 즉시 제공하는 서비스 # S3 (Simple Storage Service) - 인터넷용 스토리지 서비스로, 파일 서버의 역할을 한다. - S3에 파일을 저장하기 위해서는 버킷에 해당 파일들을 업로드하게 되는데, S3는은 데이터를 객체 형태로 버킷에 저장한다. - 버킷은 이러한 객체들의 컨테이너로 연관된 객체들을 그룹핑한 최상위 디렉토리이다. - 여러 개의 버킷을 가질 수 있으며, 각 버킷별로 리전, 보안 그룹 등을 설정해 인증과 접속 제한 등을 걸 수 있다. - 버전 관리 기능을 통해 버킷 내에 여러 개의 객체 버전을 유지할 수 있으며, 사용자가 의도치 ..
2020.06.23