혼공자 : Chapter 1~2

Chan·2022년 11월 7일
0

혼공자

목록 보기
1/7
post-thumbnail

JavaScript?

웹 브라우저에서 사용하는 프로그래밍 언어

JavaScript로 할 수 있는 것?

  • 웹 클라이언트 애플리케이션 개발
    과거 웹 : 정적 / 현재 웹 : 동적
    다양한 기능을 갖고 있다는 것을 구분하기 위해 웹 애플리케이션이라고 부른다.
    설치해야만 동작했던 과거의 애플리케이션과 달리 웹 애플리케이션은 웹 브라우저만 있으면 언제 어디서나 사용할 수 있다.

  • 웹 서버 애플리케이션 개발
    기존에는 웹 클라이언트 애플리케이션을 JavaScript로 개발하고 웹 서버 애플리케이션은 C#, Java, Ruby, Python 등의 프로그래밍 언어로 개발했다. 그래서 웹 개발을 할 때 최소 2가지 이상의 프로그래밍 언어가 필요했다. 하지만 2009년에 Node.js가 등장하면서 JavaScript로도 웹 서버 애플리케이션 개발이 가능해졌다.

Node.js의 장단점
1. 웹 서버 애플리케이션을 개발할 때 꼭 필요한 간단한 모듈만 제공
2. 속도가 빠름, 서버 구매비용과 유지비용이 1/10로 줄어듬

  • 모바일 애플리케이션 개발
    Kotlin(안드로이드), Swift(아이폰) 라는 프로그래밍 언어로 개발
    각 스마트폰에서 기본으로 인식할 수 있는 공통된 대표적인 프로그래밍 언어가 JavaScript.
    React Native을 활용해서 모든 운영체제에서 빠르게 작동하는 네이티브 애플리케이션을 만들 수 있다.

  • 데스크톱 애플리케이션 개발
    일렉트론으로 JavaScript로 데스크톱 애플리케이션을 개발할 수 있다.
    VS Code, Discord, Wordpress, MongoDB, Compass 등 모두 일렉트론으로 개발되었다.

  • 데이터베이스 관리
    일반적으로 알려진 Oracle, MySQL등 관계형 데이터베이스 관리 시스템은 모두 SQL 프로그래밍 언어를 사용한다.
    Not-Only-SQL이라고 불리며 등장한 NoSQL 중 mongoDB가 데이터베이스를 관리할 때 JavaScript를 활용하는 대표적인 NoSQL 데이터베이스이다.

Chapter 1에서 새롭게 알게 된 것?

  1. 오류 확인하는 방법에서 개발자도구 > Sources 에서 위치, 붉은색 밑줄로 확인할 수 있다는 것
    console 창에서만 확인했었는데 새로운 방법을 한가지 더 알게 되었다.

  2. 코딩 스타일, 코딩 컨벤션
    사전 스터디 토이 프로젝트 할 때 처음이라 기준을 정확하게 정하지 않고 시작했는데 부트스트랩에서 같은 구간을 사용하다보니 마지막에 합쳐질 때 class name이 같은 상황이 발생해서 새로 전부 작성하는 경우가 있었다. 다음부터는 기준점을 확실하게 잡고 시작해야겠다고 생각했다.

  3. 기본용어 중 키워드에서 모르는 것(더 공부해야 할 것)
    do, instanceof, void, with, yield, static, as, delete
    어디에 사용되는지 정확하게 알기 위해 더 공부해야 하는 키워드 용어이다.

  4. 식별자의 종류
    ------/단독O/ 다른 식별자와 사용
    괄호O / 변수 / 속성
    괄호X / 함수 / 메소드

Chapter 2 새롭게 알게 된 것?

  1. 예제 문제에서 const r
    r = 10 일 경우 오류 발생
    상수는 반드시 생성할 때 초기화를 해야 한다.

  2. prompt() - 문자열 자료형을 입력할 때
    confirm() - 자료형값으로 입력받을 때

  3. 공부해야할 것 inch > cm 단위로 변경하는 프로그램 작성

<script>
  const inch = prompt("inch를 입력해주세요");
  const numInch = Number(inch)
  document.body.innerHTML = `${inch} inch는 ${inch * 2.54}cm 입니다.`;
</script>
  1. 원의 반지름을 입력받아 원의 넓이와 둘레를 구하는 프로그램 작성
<script>
  const radius = prompt("원의 반지름을 숫자로 입력하세요");
  const numRadius = Number(r);

  const area = 3.14 * numRadius * numRadius;
  const round = 2 * 3.14 * numRadius;

  alert(`원의 반지름: ${numRadius} 원의 넓이: ${area} 원의 둘레: ${round}`);
</script>
  1. 현재 환율을 기반으로 사용자에게 숫자를 입력받아 달러에서 원화로 환율 변환하는 프로그램 작성
<script>
  const dollar = prompt("환전할 달러를 숫자만 입력하세요");
  const numDollar = Number(dollar);

  const krw = numDollar * 1392.54;

  alert(`${numDollar}$는 ${krw}원 입니다.`);
</script>

더 공부해볼 것?

1.여러 단위 변환 프로그램 구현
2.prompt 로 말고 input창으로 입력을 받아서 단위 변환 후 페이지에 나타내는 방식으로 구현
3.구현한 단위 변환기들을 한 페이지에 묶어서 구현

오늘의 리뷰?

그동안 JavaScript에 대해 여러 강의들을 봐왔기에 Chapter 1,2에 있는 내용이 생소하지 않았다.
매일매일 지식을 차곡차곡 쌓아가는 느낌이라 뿌듯하다.
다시 한번 지식을 쌓는 느낌으로 책을 읽었다.
안다고 생각했던 것들 중에서도 새롭게 알게 된 부분이 있었고 그동안 눈팅 강의로만 봐왔던 단위 변환 프로그램을 해설없이 직접 작성하게 되었다.
앞으로 더 어려운 코드들도 잘 구현할 수 있게 더 공부해야겠다.

profile
드디어 신발 신은 프론트엔드 개발자

0개의 댓글