본문 바로가기

분류 전체보기

 (35)
9월 23일 (수)_First Project - 03 (SR) 오늘의 프로젝트 진행 상황 1. 마일스톤 작성 2. 프로젝트 태스크 카드 작성 & 분배 3. 팀 룰 작성 4. API 문서 작성 1. 마일스톤 작성 Github를 사용하여 마일스톤을 작성하였습니다. 저희는 Mohaji의 Server를 구성함으로 위와 같이 백엔드가 제작해야하는 부분들인 DB, API, 배포 부문으로 이정표를 나누어보았습니다. 각각의 이정표안의 내용물은 아래 2번 프로젝트 태스크 카드를 통해 구성하였습니다. 2. 프로젝트 태스크 카드 작성 & 분배 프로젝트를 진행함에 있어 진행해야할 기능 구현들을 Issue 카드로 정리하였습니다. Issue 카드는 컴포넌트 단위로 기준을 잡아 만들었습니다. 만들면서 각 이슈마다 정해진 시간, 긴급도 등을 넣었는데, 저희가 다음주 추석을 제외하면 정규시간은 ..
9월 22일 (화)_First Project - 02 (SR) 오늘의 프로젝트 진행 상황 1. 와이어프레임, 컴포넌트 작성 2. 기능 Flow 의사코드 작성 (이후 도식화 예정) 3. 데이터베이스 스키마 작성 1. 와이어프레임, 컴포넌트 작성 위 이미지는 오늘 figma라는 Tool을 사용하여 작성한 와이어프레임을 캡쳐한 것입니다. 와이어프레임을 작성하며 좀 더 서비스의 구체적인 디테일들을 잡을 수 있었습니다. 예를 들어 Navbar, Sidebar, 회원가입 페이지 등을 어떻게 나타낼 것이며 고객에게 필요한 정보들은 어떤 것들이 있을까? 등 프로젝트를 시작할 때 생각했던 아이디어를 구체적으로 만들 수 있는 시간이였습니다. figma를 통해 실제로 버튼 클릭 이벤트 등을 구현할 수 있다고하여 이도 적용해 보려 했으나 시간이 부족하여 넘어갔던 점이 아쉬웠습니다. 이후..
9월 21일 (월)_First Project - 01 (Team Project Intro, SR) 1. Team Project Intro 오늘은 코드스테이츠 수강을 신청하고부터 기다리고 기다리던 팀 프로젝트를 시작하는 날입니다. 제 개인적으로는 코드스테이츠를 신청했던 이유가 이 프로젝트를 해보고 싶었던게 가장 큰 것 같습니다. 평소에도 아이디어들이 많았고 이런저런 것들을 만들고 싶은데 능력이 안되어 못 만들고 있었기 때문입니다. 우선 오전 시간에는 간단한 Intro 시간을 가졌습니다. SR(Software Requirements)을 하기 위한 기초적인 것들을 배운 시간이였습니다. 프로젝트 기능 구현에 있어 기본적으로 들어가야할 사항이나, Git을 활용한 협업 방식에 대한 내용들을 학습하는 시간이였습니다. 엔지니어분께서 특히 Git을 활용하는 방법이 중요하다고 하였고, master 와 dev 그리고 b..
9월 14일 (월)_Deploy (AWS - S3, EC2, RDS) 1. S3 란? Simple Storage Service의 약자로 파일 서버의 역할을 하는 서비스입니다. 일반적인 파일서버는 트래픽이 증가함에 따라서 장비를 증설하는 작업을 해야 하는데 S3는 이와 같은 것을 대행합니다. 트래픽에 따른 시스템적인 문제는 걱정할 필요가 없어진다. 또 파일에 대한 접근 권한을 지정 할 수 있어서 서비스를 호스팅 용도로 사용하는 것을 방지 할 수 있습니다. 현재 업계 1위로 Amazon S3를 사용합니다. Amazon Simple Storage Service(Amazon S3)는 업계 최고의 확장성과 데이터 가용성 및 보안과 성능을 제공하는 객체 스토리지 서비스입니다. S3의 주요개념 1) 객체(object) AWS는 S3에 저장된 데이터 하나 하나를 객체라고 명명하는데, 하..
8월 25일 (화)_Redux 1. Redux 란? 자바스크립트 싱글 페이지 애플리케이션이 갖추어할 요건이 점점 더 복잡해지고있는 만큼, 어느 때보다도 많은 상태를 자바스크립트 코드로 관리할 필요가 생겨났습니다. 항상 변하는 상태를 관리하기란 어렵습니다. 모델이 다른 모델을 업데이트하고, 그리고 뷰가 모델을 업데이트 할 수 있고, 이 뷰가 다시 다른 모델을 업데이트하고, 이에 따라 또 다른 뷰가 업데이트 됩니다. 어느 시점에서는 프로그래머조차 애플리케이션에서 무슨 일이 일어나는지 알 수 없게 됩니다. 상태를 언제, 왜, 어떻게 업데이트할지 제어할 수 없는 지경에 이르고 맙니다. 시스템이 불투명하고 비결정적일 때 버그를 재현하거나 새로운 기능들을 추가하기란 매우 어렵습니다. 더욱 안 좋은 소식은 프론트엔트 제품 개발에 있어서 새로 갖춰..
8월 21일 (금)_React (props, state, life cycle) 1. props(속성) vs state(상태) 1) props란? properties 의 줄임말입니다. 다음 예제를 통해 props의 기능을 살펴보도록 합시다. class Welcome extends React.Component { render() { return Hello, {this.props.name}; } } const element = ; 예제의 name 값으로 "Sara"를 넣을 수 있습니다. this.props.name을 통해 "Sara"라는 값을 render 할 수 있습니다. props는 부모 컴포넌트가 자식 컴포넌트한테 전달하는 값이다. 2) state란? props와 같은 형식으로 사용됩니다. 공통점 : ① 모두 JS 일반 객체이다. ② render 업데이트를 합니다. 차이점 : pro..
8월 20일 (목)_React (ES6 & JSX) 1. React 란? 1) React는 UI(User-Interface)를 만들기 위한 자바스크립트 Library입니다. React가 DOM에 접근을 하는 도구들을 제공해준다는 점은 기본 JavaScript 또는 jQuery와 같지만, 언어의 구조가 사람의 생각 구조에 가깝게 직관적이라는 점(Declarative)에서 큰 장점이 있습니다. (참고로 Facebook이 만들었습니다) - by 공식문서 2) React는 Component 기반 라이브러리이다. (Component : 하나의 의미를 가진 독립적인 단위모듈) 요즘 Web page는 단순히 Data만을 보여주지 않는다. User와의 수많은 interaction(상호작용)이 일어난다. 이렇게 되면 관리해야 하는 DOM이 많아지면서 상태관리가 어려워진다..
8월 19일 (수)_Server 용어 1. Server란? 서버(server)는 클라이언트에게 네트워크를 통해 정보나 서비스를 제공하는 컴퓨터 시스템으로 컴퓨터 프로그램(server program) 또는 장치(device)를 의미 2. Browser란? 웹 브라우저 또는 브라우저(web browser 또는 browser)는 웹 서버에서 이동하며(navigate) 쌍방향으로 통신하고 HTML 문서나 파일을 출력하는 그래픽 사용자 인터페이스 기반의 응용 소프트웨어이다. 웹 브라우저는 대표적인 HTTP 사용자 에이전트의 하나이기도 하다. 3. API란? API(Application Programming Interface, 응용 프로그램 프로그래밍 인터페이스)는 응용 프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제..

티스토리툴바