본문 바로가기

분류 전체보기89

[Redux] 리액트 - 리덕스 적용 이전 게시물에서 리덕스 개념에 대해서 간단히 언급한 적이 있다. 실제 프로젝트를 진행하면서 리액트에 리덕스를 사용함으로 인해 간단한 사용법을 정리하게 되었다. 리덕스는 어플리케이션 - 액션 - 리듀서 - 스토어 - 어플리케이션 으로 처리된다. 여기서 스토어라는 단일저장소를 이용하여 필요에 따라서 사용할 수 있게 상태값과 함수를 가져다 사용할 수 있다. Action 액션타입(action type) state의 변화를 액션값으로 정의해준다. export const CHANGE_ACTION_EXAM = 'CHANGE_ACTION_EXAM'; 액션 생성자(action creator) 액션을 만들어주는 함수인 액션생성자를 통해 파라미터를 받아와 액션객체 형태로 만들어 준다. export const setActio.. 2020. 7. 2.
[2주 Project] 2일차 TIL 2주 Project 2일차에 접어들었다. 오늘은 어제 설계했던 부분을 좀 더 세분화 하여 시간분배를 하는 작업을 하였다. Front-end 역할을 맡게 되어서 내일 부터 시작될 Sprint2 작업을 같이 Front-end를 담당하는 분과 나누어 역할 분담을 하기로 하였다. Front-end 역할을 분배 하면서 내가 맡기로 한 부분은 다음과 같았다. 홈 화면 [ ] 홈 화면(/index) 구현 ⇒ 컴포넌트 & 버튼 생성 / 디자인은 추후 회원 가입 [ ] [회원 가입] 페이지 구현 ⇒ 컴포넌트 생성 글쓰기 컴포넌트 [ ] 글쓰기 페이지 구현 [ ] 작성 버튼 건물 정보 [ ] 건물 정보 페이지(/building) 구현 건물 이름 등등 / DB 참고 [ ] Google Map 출력 [ ] 투자하기 버튼 여기.. 2020. 6. 30.
[2주 Project] 1일차 TIL 기본 교육이 끝나고 2주 프로젝트가 시작되었다. 아이디어에 맞춰 4명의 인원이 팀으로 선정되었고, 팀원들이 모여서 어떻게 구성할지 아이디어를 짜기 시작했다. 팀이름, 팀명 , 프로젝트 명을 정하는 것을 우선으로 하였다. 그리고 초기 컨셉에 대한 아이디어를 듣고, 구체화 하기 시작하였다. 그리고 이 것을 어떻게 구현할지에 대해 의견을 나누었다. 프로젝트는 부동산 P2P 경매 웹이라는 아이디어에서 출발하였다. 경매로 나온 부동산에 대해 소액 투자를 통해 높은 이익률을 만들어 유저들을 참여시킨다는 계획이었다. 그렇다면 어떤 부분들이 웹으로 구현하는 데 필요한 가에 대해 서로 아이디어를 내는 시간을 가졌다. 홈 화면 구현 로그인 페이지 구현 회원가입 페이지 구현 My page 구현 부동산 정보 페이지 구현 자유.. 2020. 6. 29.
[aws](Amazon Web Service) IM 39일차 TIL AWS 란 거대 IT기업인 아미존에서 제공하는 클라우드 플랫폼으로 전세계에서 가장 많이 사용되고 있다. 클라우드란 인터넷을 통해 가상화된 컴퓨터의 리소스 요청에 대해 즉시 제공하는 것이다. 데이터를 저장, 가공하는 다양한 기능들을 제공해주는 것이 특징이다. AWS에서는 클라우드 컴퓨터와 관련한 다양한 서비스를 제공하고 있으며, 그 중에서 중점적으로 S3, EC2, RDS에 관해 얘기하고자 한다. S3 S3란 아마존에서 제공하는 서비스 중 하나로 Amazon Simple Storage Service는 인터넷용 스토리지 서비스이다. 웹 규모 컴퓨팅 작업을 수행할 수 있게 설계되어 있으며 원하는 양의 데이터를 저장하고 검색할 수 있게 만들어 준다. 간단하게 S3를 하는 방법에 대해 설명하겠다. AWS에서 Am.. 2020. 6. 23.
cookie & session cookie와 sessions은 http 프로토콜을 유지하기 위한 기술 우선 http프로토콜의 특징에 대해서 알아야 쿠키와 세션에 대한 이해가 가능하다. HTTP프로토콜 특징 connectionless - 비연결 지향의 의미로 클라이언트가 서버에 요청을 보낸 후 클라이언트로 응답을 받으면 연결을 끊는 특징 stateless - 클라이언트와 서버의 정보가 연결이 끊기게 되면 유지되지 않는 특징 이 두가지 특성으로 인해 사용자가 접속하였을 때 이전 사용자와 같은 사용자인지 알 수 있는 방법이 없어진다. 통신을 할 때 클라이언트에서 매 요청 마다 사용자가 계속 인증해야하는 단점이 발생한다. 이를 보완하기 위해 쿠키와 세선을 필요로 한다. cookie 쿠키는 클라이언트 쪽에 주고받는 데이터 클라이언트의 상태 정.. 2020. 6. 19.
[ORM] ORM 프레임워크 ORM(Object-Relational Mapping) 관계형 데이터베이스와 객체지향 프로그래밍 언어 간 호환되지 않는 데이터를 변환하는 프로그래밍 기법이다. 객체지향 언어에서 사용하는 객ㅊ체를 관계형 데이터 베이스로 변환하여 테이블을 구성하는데 활용한다 ORM프레임워크의 기술 ORM프레임워크에는 크게 SQL Mapping 기반 기술과 OR Mapping 기반 기술로 구분된다. 유형 기술 설명 SQL Mapping iBatis SQL에 기반한 데이터베이스와 자바, 닷넷(.NET), 루비(Ruby) 등을 연결시켜주는 역할을 하는 개발 프레임워크 MyBatis 객체지향 언어인 자바의 관계형DB프로그래밍을 좀 더 쉽게 할 수 있게 도와주는 개발 프레임워크 OR Mapping Hibernate 자바언어를 위한 .. 2020. 6. 17.
[MySQL] MySQL 과 schema 데이버베이스에 관련된 프로그램으로 SQL에 대해 배우는 시간이었다. SQL은 데이터베이스를 불러와 서버에서 사용할 수 있도록 만들어 주는 것이다. SQL에 대한 이해 전에 schema를 통해 데이터베이스의 구조를 짜는 것이 중요하다. MacOS 에서 MySQL 시작 MacOS 에서 MySQL을 시작하기 위해서는 Homebrew 설치가 필요하다. Homebrew Homebrew The Missing Package Manager for macOS (or Linux). brew.sh 홈페이지 설치 방법에 따라 시작하면 된다. 설치 후 터미널에 다음과 같이 설정하면 된다. $ brew install mysql $ brew info mysql MySQL을 열기 위해서는 다음과 같은 명령어가 필요하다 mysql -.. 2020. 6. 15.
IM 29일차 TIL(promise) Promise 프로미스(Promise)란 자바스크립트 비동기 처리에 사용되는 객체로 어떤 코드를 실행이 완료되기 전에 다음 코드를 수행되는 특성이다. 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시하기 위해 사용된다. 프로미스는 3가지 특징을 가진다. Pending(대기) : 비동기 처리 로직이 아직 완료되지 않은 상태 Fulfilled(이행) : 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태 Rejected(실패) : 비동기 처리가 실패하거나 오류가 발생한 상태 pending(대기)는 new Promise() 를 호출하게 되면 대기 상태가 된다. new Promise(function(res, rej){ }); 콜백 함수로는 resolve, reject를 받는다. fulfilled(이행.. 2020. 6. 9.
IM 26일차 초보개발자 TIL 3번째 테스트를 보는 날이었다. 이전 까지 배웠던 React나 express, Redux에 대한 개념의 이해가 많이 부족하였다. Personal Portfolio를 만드는 것에 있어서도 많이 부족하였다. 정확히 말하면 제대로 구현되지 못하였다. 부족한 부분이 많다보니 테스트를 볼때도 어려움을 많이 느꼈다. 테스트가 끝나고 다시한번 개념들을 하나하나 찾아가며 공부를 하였고, 이전 과제들을 살펴보며 이해하려고 노력하였다. 클라이언트에서 사용되는 react router에 대한 이해 서버의 URL을 접근할 때 클라이언트에 접근하는 방법 Build를 통해 서버에 넘겨주는 방법 middleware의 이해 리듀서와 액션 등등 아직 이해하지 못한 부분들이 너무 많다는 것을 느끼게 되었다. solo day기간 동안 이 .. 2020. 6. 4.

티스토리툴바