[도서리뷰] JavaScript Everywhere

JavaScript Everywhere 한빛미디어

안녕하세요 앵글로퍼입니다. 아주 오랫만에 도서리뷰를 합니다. 오늘 리뷰할 도서는 자바스크립트는 모든 곳에 존재한다(JavaScript Everywhere)라는 도서입니다. 약 2주전 한빛미디어로부터 책을 받았고, 약 1주일에 걸처서 독서를 완료한 후 리뷰를 합니다. :)

 

TLDR;

자바스크립트는 모든 곳에 존재한다( JavaScript Everywherer) 책의 제목만보면 자바스크립트는 모든곳에 있다는 의미인가? 여러 분야에서 활용되는 자바스크립트에대한 책인가? 할 수 있지만 자바스크립트로 모든것을 만드는 이야기이다. 자바스크립트를 이용해서 서버 / 웹 프론트엔드 / 데스크탑용 클라이언트 / 어플리케이션 모드것을 만드는 방법을 다룬다. 책의 설명과 예제코드를 따라가면 웹 / 모바일 / 데스크탑에서 모두 사용할 수 있는 노트 서비스를 만들게된다. 이 과정에서 자바스크립트를 이용해서 서비스를 구축하는 경험을 하게되고, 자세히는 아니지만 각 기능을 만들때 필요한 기술에대한 공부를 할 수 있고 흥미있는 분야를 더 깊게 공부를 시작할때 필요한 키워드들을 알려준다. 아주 깊은 내용을 다루지는 않기때문에 개발 경험이 있는 사람이라이  멀티플렛폼에서의 서비스 구축을 고려한다면 가볍게 읽기 좋은 책이다. 

 

본문

먼저 목차부터 보기로하자. 

더보기

CHAPTER 1 개발 환경

1.1 텍스트 편집기

1.2 터미널

1.3 커맨드 라인 도구와 홈브루(맥에만 해당)

1.4 Node.js와 NPM

1.5 몽고DB

1.6 깃

1.7 엑스포

1.8 프리티어

1.9 ESLint

1.10 미관 꾸미기

1.11 결론

 

CHAPTER 2 API 소개

2.1 무엇을 만들 것인가

2.2 어떻게 만들 것인가

2.3 시작하기

2.4 결론

 

CHAPTER 3 노드와 익스프레스로 웹 애플리케이션 만들기

3.1 Hello World

3.2 Nodemon

3.3 포트 확장 옵션

3.4 결론

 

CHAPTER 4 그래프QL API 첫걸음

4.1 서버를 API로

4.2 그래프QL 기초

4.3 API 적용하기

4.4 결론

 

CHAPTER 5 데이터베이스

5.1 몽고DB 시작하기

5.2 몽고DB와 애플리케이션 연동하기

5.3 애플리케이션에서 데이터 읽고 쓰기

5.4 결론

 

CHAPTER 6 CRUD 동작

6.1 그래프QL의 스키마와 리졸버 분리하기

6.2 그래프QL CRUD 스키마 작성

6.3 CRUD 리졸버

6.4 날짜와 시간

6.5 결론

 

CHAPTER 7 사용자 계정과 인증

7.1 애플리케이션 인증 흐름

7.2 암호화와 토큰

7.3 API에 인증 통합하기

7.4 리졸버 콘텍스트에 사용자 추가하기

7.5 결론

 

 

CHAPTER 8 사용자 액션

8.1 시작하기 전에

8.2 사용자를 새 노트에 연결하기

8.3 업데이트와 삭제 권한

8.4 사용자 쿼리

8.5 즐겨찾기 노트 설정

8.6 중첩 쿼리

8.7 결론

 

CHAPTER 9 디테일

9.1 웹 애플리케이션과 익스프레스의 모범 사례

9.2 페이지네이션

9.3 데이터 제한

9.4 기타 고려 사항

9.5 결론

 

CHAPTER 10 API 배포하기

10.1 데이터베이스 호스팅

10.2 애플리케이션 배포

10.3 결론

 

CHAPTER 11 사용자 인터페이스와 리액트

11.1 자바스크립트와 UI

11.2 자바스크립트와 선언적 인터페이스

11.3 새 리액트 애플리케이션

11.4 결론

 

CHAPTER 12 리액트로 웹 클라이언트 만들기

12.1 무엇을 만들 것인가

12.2 어떻게 만들 것인가

12.3 시작하기

12.4 웹 애플리케이션 만들기

12.5 라우팅

12.6 UI 컴포넌트

12.7 결론

 

 

CHAPTER 13 애플리케이션에 스타일 입히기

13.1 레이아웃 컴포넌트 생성하기

13.2 CSS

13.3 결론

 

CHAPTER 14 아폴로 클라이언트로 작업하기

14.1 아폴로 클라이언트 셋업

14.2 API에 쿼리하기

14.3 동적 쿼리

14.4 페이지네이션

14.5 결론

 

CHAPTER 15 웹 인증과 상태

15.1 회원가입 양식 만들기

15.2 리디렉션

15.3 요청에 헤더 붙이기

15.4 로컬 상태 관리

15.5 로그아웃하기

15.6 로그인 양식 만들기

15.7 경로 보호하기

15.8 결론

 

CHAPTER 16 생성, 읽기, 업데이트, 삭제 작업

16.1 새 노트 생성

16.2 노트 읽기

16.3 노트 업데이트

16.4 노트 삭제

16.5 즐겨찾기 추가/제거

16.6 결론

 

CHAPTER 17 애플리케이션 배포하기

17.1 정적 웹 사이트

17.2 배포 파이프라인

17.3 결론

 

CHAPTER 18 일렉트론으로 데스크톱 애플리케이션 개발하기

18.1 무엇을 만들 것인가

18.2 어떻게 만들 것인가

18.3 시작하기

18.4 첫 일렉트론 앱

18.5 맥OS 애플리케이션 창

18.6 개발자 도구

18.7 일렉트론 API

18.8 결론

 

CHAPTER 19 기존의 웹 애플리케이션과 일렉트론 통합하기

19.1 웹 애플리케이션 통합

19.2 설정

19.3 콘텐츠 보안 정책

19.4 결론

 

CHAPTER 20 일렉트론 배포

20.1 일렉트론 빌더

20.2 현재 플랫폼 빌드하기

20.3 앱 아이콘

20.4 다중 플랫폼용 빌드

20.5 코드 서명

20.6 결론

 

CHAPTER 21 리액트 네이티브로 모바일 앱 만들기

21.1 무엇을 만들 것인가

21.2 어떻게 만들 것인가

21.3 시작하기

21.4 결론

 

CHAPTER 22 모바일 앱 셸

22.1 리액트 네이티브의 빌딩 블록

22.2 스타일과 스타일드 컴포넌트

22.3 라우팅

22.4 아이콘

22.5 결론

 

CHAPTER 23 그래프QL과 리액트 네이티브

23.1 리스트와 스크롤 콘텐츠 뷰 만들기

23.2 아폴로 클라이언트와 그래프QL

23.3 로딩 인디케이터 추가하기

23.4 결론

 

CHAPTER 24 모바일 앱 인증

24.1 인증의 흐름

24.2 로그인 양식 만들기

24.3 그래프QL 뮤테이션으로 인증하기

24.4 그래프QL 쿼리

24.5 회원가입 양식 추가하기

24.6 결론

 

CHAPTER 25 모바일 앱 배포하기

25.1 설정

25.2 아이콘과 앱 로딩 화면

25.3 엑스포에서 퍼블리시하기

25.4 네이티브 빌드 생성하기

25.5 앱 스토어에 배포하기

25.6 결론

 

부록 A 로컬에서 API 실행하기 

부록 B 로컬에서 웹 앱 실행하기

목차를 보면 알겠지만 개발환경구성부터 그래프QL, 몽고디비에대한 설명도 나오며 서버 / 웹 프론트엔드 / 데스크톱 클라이언트 / 모바일 어플리케이션까지 멀티플랫폼 서비스를 위한 다양한 내용이 나와있다. 

다만 아쉬운점은 책에서 저자가 직접 언급하기도했지만 테스트에 대한 내용이 없는것은 아쉬운점이다.

책의 구성에서 좋은점은 굳이 맨앞부터 읽을 필요가 없다는점이다. 만일 나는 이미 노드와 express에대해서는 잘 알고있기때문에 데스크톱 클라이언트나 모바일 어플리케이션을 만드는부분만 읽고싶다면 책의 부록에 나와있는 방법을 이용하면 앞부분을 건너뛰고 책의 예제와 설명을 보는데 전혀 지장이 없다. 저자 혹은 편집자의 세심한 배려가 눈에 띄는 부분이다. 

그리고 필자의 경우 항상 혼자 공부를 하다보면 인증 / 배포에관한 좋은 자료를 찾기가 어려운데 이 책에선 그런부분을 세심하게 알려주는 점이 매우 좋았다.

필자가 책을 읽어본후 느낀점이 이 책은 지식보다는 정보의 전달에 초점을 맞추고 있다는 점이다. 모든 개발자들이 당연히 node.js를 이용하면 웹 / 데스크톱 / 모바일 에서 구동되는 프로그램을 만들 수 있다는 사실은 이미 알고있을것이다. 중요한것은 어떻게? 이다. 저자가 머릿말에서 말한것처럼 node.js / express / react / react-native 등 node.js의 프래임워크들을 각각 소개한 자료는 너무나도 많지만 모든것을 통합한 자료는 찾기 힘들다. 그말의 뜻은 어디서부터 시작해야할지 모른다는 의미이다. 책을 읽고난 후 독자는 '아무것도 모르는 상태' 에서 '내가 뭘 모르는지를 알고있는 상태'가 된다. 저자의 설명을 따라가면서 하나의 멀티플렛폼 서비스를 만드는 경험을 하고나면 내가 부족한점을 알게되고, 궁금한점을 알게된다. 이제 내가 뭘 모르는지 알게되었으니 그부분을 공부하면된다. 

여러 개발자들은 본인의 분야에서는 뛰어나지만 다른 분야에 대해서는 지식의 깊이가 깊어지기가 어렵다. 토이프로젝트를 해보려는 서버개발자의 첫번째 난관이 이것일거같다. '프론트는 어떻게하지? 요즘 서비스를 모바일 없이 하는게 말이되나? 안드로이드랑 스위프트를 공부해야하나?' 이런 고민이드는 개발자라면 가볍게 이 책을 읽기를 권한다.

책에서 깊은 내용을 다루고있지는 않지만 저자가 친절하게 더 자세한 내용을 공부하고싶은 사람들을 위해서 좋은 레퍼런스가 있는 url을 알려준다. 한번읽으면서 표시해두었다가 본격적으로 공부를 할때 찾아보면 도움이 될것이다. 

결론 

소스코드에 익숙한 개발자들이 토이프로젝트를 진행하기전에 한번 읽어보길 추천한다. 저자가 소개해주는 정보를 보고 예제를 따라하면 대략적으로 본인의 토이프로젝트를 어떻게 구성하면좋을지에대한 좋은 이사이트를 얻을 수 있다. 

본격적인 개발 경험이 없는 초보개발자에게도 추천한다. 저자는 책의 내용을 실습위주로 풀어내고있다. 저자의 설명을 들으면서 예제코드를 따라 치다보면 하나의 큰 서비스를 만드는 경험을 하게되고 초보개발자에게 이런 경험은 매우 중요하다. 

마치며

좋은 책을 리뷰할 기회를 준 한빛미디어 관계자분들께 감사의 인사를 드린다. 그리고 옆에서 날 항상 응원해주는 안랙술에게도 감사의 인사를 전하고싶다.

반응형

크루세이더 킹스 2 가 무료라는 소식을 듣고 다운을 받았다. 스팀에서 다운을 받았는데 화면이 이상하다... 해상도가 맛이 가서 클릭이안된다.

조금 찾아보니 남들도 좀 겪는 문제더라. 한글자료로는 못찾아서 영어로 찾았더니 나와서 여기에 공유한다.

스팀을 통해서 맥에 크루세이더 킹스 2 를 설치하고 한번 실행을하면 Document(문서)/Paradox Interactive/Crusader Kings II 폴더 아래에 setting.txt 라는 파일이 생성되면서 세팅이 저장된다.

해당 파일을 열고

graphics=  
{  
    size=  
    {  
        x=1680  
        y=1050  
    }  

    gui\_scale=1.000000  
    gui\_scale\_min=1.000000  
    gui\_scale\_max=3.000000  
    gui\_scale\_font\_replacement=1.010000  
    refreshRate=0  
    fullScreen=no  
    borderless=yes  
    shadows=no  
    shadowSize=2048  
    multi\_sampling=0  
    anisotropic\_filtering=0  
    gamma=50.000000  
    vsync=yes  
    override\_resolution\_safety=no  
}

graphics 부분을 수정해주면된다.

반응형

Iterator

컬렉션에 저장된 요소를 읽어오는 방법을 표준화한것.
다음의 메소드를 포함하고있다.

  • hasNext() : 읽어올 다음 요소가 있는지 확인하는메소드. 다음 요소가 있다면 true, 없다면 false를 반환
  • next(): 다음 데이터를 리턴
  • remove() : next()로 읽어온 요소를 제거.
반응형

Interface VS Abstract

Abstract class(추상 클래스)

  • 클래스 구현 내부에 추상 메서드가 하나 이상 포함되거나 abstract로 정의된 경우.
  • Abstract class의 특징
    • new 연산자를 사용하여 객체르 생성할 수 없다.
      • 단일 상속만이 가능하다.
      • Abstract 클래스는 동일한 부모를 가지는 클래스를 묶는 개념으로 상속을 통하여 기능을 확장시키는것이 목적이다.

Interface

  • 모든 메소드가 추상 메소드이다.
  • Java 8 이후에서는 default 키워드를 이용하면 메소드를 구현할 수 도 있다.
  • static final필드만 가질 수 있다.
  • new 연산자를 사용하여 객체를 생성할 수 없다.
  • 다중상속이 가능하다.
  • 구현 객체가 같은 동작을 한다는것을 보장하려는 목적으로 사용된다.

Abstract class와 Interface의 공통점

  • 선먼만 있고 구현 내용은 없는 클래스이다.
  • 인스턴스화가 불가능하다.
  • 상속 / 구현한 클래스를 이용해서 객체를 생성해야한다.

Abstract class와 Interface의 차이점

  • Abstract class - 단일상송 / Interface - 다중 상속
  • Abstract 의 목적은 상속을 이용하여 기능을 확장시키는 것이다.
  • Interface의 목적은 메소드가 구현됨을 보장하는것이다.
반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

스프링 부트 어플리케이션이 실행되면 어떤 일들이 일어나는가.  (0) 2024.11.30
이터레이터(Iterator)  (0) 2021.01.11
WAS의 동작방식  (0) 2021.01.11
DB정규화  (0) 2021.01.11
MVC란?  (0) 2021.01.11

WAS의 동작방식

  • WAS

    • Web Server와는 다르게 DB조회 등 다양한 로직 처리를 요구하는 동적인 컨텐츠를 담당.
    • 웹 컨테이너, 혹은 서블릿 컨티에너라고 불림.
    • 분산 트랜잭션, 보안, 메시징, 스레드 처리 등의 기능을 처리하는 분산환경에서 사용
    • Tomcat, JBoss 등이 대표직인 WAS이다.
  • 동작 방식

    1. Web Server 의 클라이언트의 요청에 맞는 Servlet을 메모리에 올린다.
    2. web.xml에을 참조해 해당 Servlet에 대한 Thread를 생성한다.
    3. HttpServletRequest와 HttpServletResponse 객체를 생성하고 그에 맞는 doGet 또는 doPost 메소드를 호출해 생성된 동적 페이지를 Response 객체에 담아 WAS에 전달한다. ex) doGet(HttpServletRequest request, HttpServletResponse response)가 리턴하는 Response 객체를 WAS에 전달.
    4. WAS는 HttpResponse 형태로 바꾸어 WebServer에 전달하고 생성된 스레드와 HttpServletRequest, HttpServletResponse 객체를 제거한다.

    참고자료 : https://new-be.tistory.com/3

반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

이터레이터(Iterator)  (0) 2021.01.11
Interface VS Abstract  (0) 2021.01.11
DB정규화  (0) 2021.01.11
MVC란?  (0) 2021.01.11
Java Collection framework interface의 특징  (0) 2021.01.11

DB 정규화

정규화란: 데이터를 저장할때 불필요한 데이터를 제거하고, CRUD시 발생할 수 있는 각종 사이드이팩틀르 방지한다.

1차 정규화 : 도메인 원자성을 확보 ( 한 컬럼이 하나의 값만을 가진다.)
2차 정규화 : 부분적 함수 종속 제거(즉, 완전 함수적 종속으로 만든다.)
3차 정규화 : 이행적 함수종속 제거 (즉, 키 이외의 다른 값이 다른 컬럼을 결정할 수 없다.)
BCNF: 모든 결정자가 후보키 집합에 속하게 만든다.

반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

Interface VS Abstract  (0) 2021.01.11
WAS의 동작방식  (0) 2021.01.11
MVC란?  (0) 2021.01.11
Java Collection framework interface의 특징  (0) 2021.01.11
Error와 Exception  (0) 2021.01.10

MVC란?

MVC : Model, View, Controller

  • 어릎리케이션 / 프로젝트를 구성할때 구성요소를 모델 / 뷰 / 컨트롤러 세가지로 구분한 패턴.

    Model : 어플리케이션의 정보, 데이터를 나타냄. DATA / 정보의 가공을 책임지는 컴포넌트.

  • Model이 지켜야하는 규칙

    1. 사용자가 편집하길 원하는 모든 데이터를 가지고있어야한다.
    2. 뷰나 컨트롤러에 대해서 어떤 정보도 알 필요가없다.
    3. 변경이 일어나면 변경 통지에 대한 처리방법을 구현해야한다.

    View : 사용자와의 인터페이스를 담당하는 컴포넌트.

  • View가 지켜야하는 규칙

    1. 모델이 가진 정보를 따로 저장해서는 안된다.
    2. 모델이나 컨트롤러와 같이 다른 구성요소들을 알 필요가 없다.
    3. 변경이 일어나면 변경 통지에 대한 처리방법을 구현해야한다.

Controller: 모델과 뷰를 연결해주는 컨트롤러 역할

  • Controller가 지켜야하는 규칙
    1. 모델 / 뷰에 대해 알고있어야한다.
    2. 모델 / 뷰의 변경을 모니터링해야한다.

MVC 패턴의 장점

  • 각각의 역할을 정한 컴포넌트를 만들어 각각의 역할에 집중할 수 있도록한다.
  • 각각의 역할에 집중하고있기때문에 유지보수성 / 확장성 / 유연성이 증가한다.
반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

WAS의 동작방식  (0) 2021.01.11
DB정규화  (0) 2021.01.11
Java Collection framework interface의 특징  (0) 2021.01.11
Error와 Exception  (0) 2021.01.10
REST API에 대해서  (0) 2021.01.10

Java Collection framework interface의 특징

 - List : 순서가 있는 데이터의 집합, 데이터의 중복을 허용
- Set : 순서가 없는 데이터의 집합, 데이터의 중복을 허용하지 않는다.
- Map : key / value의 쌍으로 이루어진 데이터의 집합. 순서는 유지되지 ㅇ낳으며 키는 중복ㅇ르 허용하지 않고 값은 중복을 허용한다. 
반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

DB정규화  (0) 2021.01.11
MVC란?  (0) 2021.01.11
Error와 Exception  (0) 2021.01.10
REST API에 대해서  (0) 2021.01.10
MSA란 무엇인가?  (0) 2021.01.10

Error와 Exception

Error

컴파일시 문법적인 오류와 런타임시 예측불가능한 에러가 있다. 에러의 예로는 StackOverflowError / OutOfMemoryError 등이 있으며 발생시 프로세스가 종료된다. 핸들링이 불가능하고 회복이 불가능하다.

Exception

프로그램이 핸들링이 가능한 경우 익셉션이라한다.
처리가 가능하다.
프로그램이 동작중 예상하지 못한 상태가 발생하여 수행중인 프로그램이 영향을 받는것.
CheckedException(Compile tiem)

  • 컴파일시점에 예측이 가능하다.
    UncheckedException(Run time)
    • 컴파일 시점에는 예측이 불가능하고, 런타임시에 발생하는 예외

스프링에서의 예외처리

  1. 메소드 단위에서 try/catch를 이용하여 처리
  2. 컨트롤러 단위에서 @ExceptionHandler를 이용해서 처리
    • @Controller / @RestController 가 적용된 Bean내에서 발생하는 예외를 잡아서 하나의 메소드에서 처리해주는 기능.
  3. @ControllerAdvise를 이용하여 Global level에서 컨트롤러 이후 Client에게 전달되기 직전 처리
    • @ControllerAdvise 모든 @Controller 즉, 전역(Global)에서 발생할 수 있는 예외를 잡아서 처리해주는 어노테이션
반응형

'프로그래밍 > 면접대비문제' 카테고리의 다른 글

MVC란?  (0) 2021.01.11
Java Collection framework interface의 특징  (0) 2021.01.11
REST API에 대해서  (0) 2021.01.10
MSA란 무엇인가?  (0) 2021.01.10
[IT 개발자 면접 대비문제] Spring의 원리  (0) 2016.09.17
반응형

+ Recent posts