전체 글(43)
-
4주-Project - 개요, 사용 스택 및 구현 사항
내가 맡은 역할, 진행한 부분 나열해 보기 ※ 추후 전반적 개요, 소개 이미지 등 추가 예정. ◈ 프로젝트 개요 ( 기업협업 프로젝트 ) 컨셉 : 블록체인, 스마트 컨트랙트를 이용한 콘서트 스마트티켓 모바일앱 개발 프로젝트 - 인터넷으로 콘서트 티켓을 구입 시 종이 티켓으로 받는 대신 고객이 티켓을 서버를 통해 핸드폰으로 받게 해주는 전자 티켓 시스템. ◈ 역할 ( Back-end ) ◈ 사용 스택 node.js koa - 코아 사용이유? mongodb, mongoose - NoSQL의 장점? 사용이유? typescript - 도입시 겪은 점? 사용이유? jwt ◈ 구현 기능 basic-server 서버 구동 - why use koa? Restful API 작성 - 서버와 프론트간 통신시 겪은 이슈 DB..
2019.12.09 -
2주-Project(6)
리액트에 관하여...(더 익숙해진 것들, 소화한? 것들, 느낀점) state에 관하여 state를 정말 '상태' 그대로 받아들이고 true/false 등 흑백구분 정도로밖에 생각을 못하고 사용해왔다. state에는 배열, 객체형태 등 여러가지 데이터를 담아서 사용할 수 있다. dom을 사용하지 않고 깔끔하게 데이터를 렌더링할 수 있었다. 계속 착각하고 있던점, 알고있었으나 까먹었던... 이번 기회에 머리에 더 박힌것 같다. 상위에서 내려준 state를 하위에서 setState로는 변경 불가 변경하려면 상위에서 setstate를 해주는 함수를 만들어 props로 내려주어서 하위에서 함수실행을 통해 상위 state를 변경. 라이프사이클에 대해 한번 더 생각해 보게 됨.(didMount/ didUpdate) ..
2019.11.09 -
2주-Project(5)
※개인 학습 블로그 입니다.※ ※ajax 에 대하여 포이마웹 참고 ※ https://poiemaweb.com/js-ajax Ajax | PoiemaWeb 비동기식 처리 모델(Asynchronous processing model or Non-Blocking processing model)은 병렬적으로 작업을 수행한다. 즉, 작업이 종료되지 않은 상태라도 대기하지 않고 다음 작업을 실행한다는 의미이다. 예를 들어 서버에서 데이터를 가져와 화면에 표시하는 작업을 수행할 경우 서버에 데이터를 요청한 이후 서버로부터 데이터가 전달될 때까지 대기하지 않고(Non-Blocking) 즉시 다음 작업을 수행한다. 이후 서 poiemaweb.com 토큰 인증 - stateless 서버 토큰 사용X - stateful 서버..
2019.11.06 -
2주-Project(4)
로그인/로그아웃 페이지 이동 → 순수 react 의 state 이용 의문점!!! 로그인/로그아웃은 토큰 또는 세션을 통해 서버쪽에서 처리해주는 것으로 알고있었다. - ex) 로그아웃 후 서버단에서 session destroy 후 redirect('/') 처리 검색을 해 보니 순수 리액트(+리덕스??) 로 로그인/아웃 기능을 구현할 수 있는 것 같다. → 말이되는 건지 의문, 조사가 필요함 - localstorage 라는 것을 이용하는 것 같은데 아직 명확하지 않다. - redux 와 많이 관계된 것 같음. (logged 등 내장 함수 이용??) - 위와같은 경우 쿠키(토큰) 는??? 어떻게 관계되는 것인가? 일단 프론트단에서 로그인/회원가입/로그아웃 등 각종 페이지 이동은 구현하였으나, 서버와 연동이 되..
2019.11.05 -
2주-Project(3)
클라이언트 - 서버간 통신 에러 ※현상은 ? 클라이언트에서 요청을 보낸 후 서버 쪽에서 신호는 들어오지만 req.body는 빈 객체로 찍힘. ( post 404 not found ) req.on('data', ... ) → 콘솔로 찍어보면 잘 나옴. 포스트맨으로 post요청시 서버쪽에 잘 들어오는 것 확인. ※무엇이 원인일까 ? 서버 쪽인지 클라이언트 쪽인지 명확하지 않음. 이전 cors 에러는 해결됨. 헤더 구성이 문제일까? - simple / preflight ... (content-type, authorization 등등...? 명확하지 않음) content-type 바꾸면 그에따라 cors에러가 뜨기도 함. 원인은 cors 선언의 위치 오류 cors require 및 선언을 cors 사용 app...
2019.11.05 -
2주-Project(2)
※개인 학습 공간입니다.※ ※참고 블로그, 자료 - velopert님의 react-router 1장 https://velopert.com/3417 react-router :: 1장. 리액트 라우터 사용해보기 | VELOPERT.LOG 이 튜토리얼은 3개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. SPA 란? Single Page Application (싱글 페이지 어플리케이션) 의 약자입니다. 말 그대로, 페이지가 1개인 어플리케이션이란 뜻입니다. 전통적인 웹어플리케이션의 구조는, 여러 페이지로 구성되어있습니다. 유저가 요청 할 때 마다 페이지가 새로고침되며, 페이지를 로딩 할 때 마다 서버로부터 리소스를 전달받아 해석 후 렌더링을 합니다. HTM velopert.c..
2019.11.01