git 공부를 하던 중 CLI, GUI라는 단어를 보게 되었다. 어디서 한 번쯤은 본 것 같은 단어. 두 단어는 무슨 뜻일까? CLI 사진과 같이 CLI로 git commit을 실행하려면, 'git commit' 와 같은 텍스트를 입력해야 한다. 이처럼 CLI(Command Line Interface)는 사용자가 터미널에 직접 명령어를 입력하는 방법을 말한다. [참고] 터미널이란 컴퓨터와 사용자 간 텍스트 입/출력을 통해 상호작용하는 컴퓨터 인터페이스로, 윈도우의 cmd, 맥과 리눅스의 terminal을 말한다. CLI의 특징은 다음과 같다. 사용자가 컴퓨터를 탐색하는데 필요한 작업은 다양한 텍스트 명령을 통해 OS와 직접 상호작용한다. 따라서 CLI를 사용하려면 사용자가 이러한 명령어를 알아야 한다. ..
[출처] https://roadmap.sh/frontend Frontend Developer Roadmap Learn to become a modern frontend developer using this roadmap. Community driven, articles, resources, guides, interview questions, quizzes for modern frontend development. roadmap.sh
'개발자로 취업하려면 CRUD는 할 줄 알아야 한다'는 이야기를 자주 듣는다. 그렇다면 CRUD는 무슨 뜻일까? 블로그 글 작성을 예시로 이해해보자. 지금 이 글을 작성하여 '완료(작성)' 버튼을 누른다면, 글 정보는 데이터베이스에 저장되고 저장한 것을 다시 읽어와 글 목록에서 보여준다. 즉, 사용자인 내가 이용중인 블로그 웹과 데이터베이스가 상호작용 하고 있는 것이다. 나는 글을 작성할 수도 있고, 볼 수도 있고, 수정할 수도 있고, 삭제할 수도 있다. 이 네 가지의 약어를 CRUD라고 한다. 이름 의미 SQL Create 생성 INSERT Read 조회 SELECT Update 수정 UPDATE Delete 삭제 DELETE 버튼을 화면에 만들고, 그 버튼을 클릭했을 때 해당 데이터를 모두 읽어와 컴..
문제 정수 num1, num2가 매개변수로 주어질 때, num1을 num2로 나눈 몫을 return 하도록 solution 함수를 완성해 주세요. 제한사항 0 < num1 ≤ 100 0 < num2 ≤ 100 입출력 예 num1 num2 result 10 5 2 7 2 3 내가 작성한 답안 function solution(num1, num2) { let answer = parseInt(num1 / num2); return answer; } 7 / 2 = 3.5의 경우처럼 몫이 정수가 아닌 값이 나올 수 있으므로 parseInt()를 이용해 실수를 정수형으로 변환하였다. parseInt()는 문자열 인자를 파싱하여 특정 진수의 정수를 반환한다. 다른 사람들이 작성한 답안 Math.floor function..
백준, 프로그래머스 문제를 풀고 내 풀이를 수동으로 올려도 좋지만, 번거로울 수 있다. 그걸 자동으로 커밋해주는 프로그램이 있다면? 바로 백준허브다. 백준허브는 내가 푼 문제가 정답일 경우 해당 코드뿐만 아니라 성능과 메모리, 구체적으로 어떤 문제였는지 까지 같이 커밋한다. 백준허브 설정 방법은 아래와 같다. 1. 크롬 확장 프로그램 설치 먼저 크롬 웹스토어에서 백준허브 확장 프로그램을 설치한다. 다운로드 링크는 아래와 같다. https://bit.ly/3XR66UE 백준허브(BaekjoonHub) Automatically integrate your BOJ submissions to GitHub chrome.google.com 2. 깃허브 연동 설치가 완료되면 크롬 주소창 우측 퍼즐모양에서 해당 확장프로..
사용자가 웹에서 특정 데이터를 요청했을 경우, 우리는 이 데이터를 어떻게 넘기고 결괏값을 보여줄 것인지를 정해야 한다. 이것을 진행하는 것이 바로 HTTP(Hyper Text Transfer Protocol)이다. HTTP는 브라우저와 서버가 통신할 수 있도록 만들어주는 여러 프로토콜(규약, 규칙) 가운데 한 종류로, 웹 브라우저와 웹 서버 사이에 HTML문서를 주고받는데 쓰이는 통신 프로토콜이다. 위와 같이 클라이언트(요청을 보내는 쪽, Requset)와 서버(요청을 받는 쪽, Respose)가 HTTP로 통신할 때, 데이터를 어떻게 넘길 것인가를 결정하는 것이 'GET'과 'POST'이다. 각 방식의 대표적인 특징을 먼저 살펴보고 이후 예시와 함께 직접 확인해 보자. GET GET방식의 대표적인 특징..
'구글이 없으면 일을 못한다.'는 개발자들의 농담이 있다. 그만큼 개발자들은 업무를 하며 오픈되고 공유된 관련 내용들을 구글링하여 많이 찾아본다는 이야기이다. 모든 코드를 내가 직접 창조해 낼 수 없으며, 좋아하는 멘토인 드림코딩 엘리님도 '뛰어난 개발자는 필요한 것을 빠르게 찾아 효율적으로 적용해 나가는 사람이다.'라고 말씀하셨다. 그렇다면 정보의 바다라고 불리는 구글에서 어떻게 내가 원하는 내용만 찾아낼 수 있을까? 이때 이용할 수 있는 것이 구글의 검색연산자이다. 구글은 검색어에 기호나 단어를 사용하여 더 정확한 검색 결과를 얻을 수 있도록 하는데, 내가 가장 자주 사용하는 검색 연산자만 정리해보았다. " " ▶ 정확히 일치하는 결과를 검색할 때 구글에서 '검색연산자'를 검색하게 되면, 해당 단어가..
이해를 위한 기본 세팅 설명 [내 PC]의 [사진] 폴더 안에 [Scan], [오류] 폴더가 있으며 동등한 위치에 'capture.jpg'가 있다. [Scan] 폴더 안에는 'black.jpg'가, [오류] 폴더 안에는 '1.jpg', '2.jpg', '3.jpg'가 있다. 절대 경로 ▶ 최상위 디렉토리(=파일)를 반드시 포함하여 작성된 경로 사진에 보이는 '1.jpg'의 절대경로는 내 PC\사진\오류\1.jpg 이다. 절대경로는 직관적이어서 이해하기 쉽지만, 찾아가는 과정에서 여러 파일을 거칠 경우 경로가 길고 복잡해진다는 단점이 있다. 상대 경로 ▶ 현재 디렉토리(기준 비교 대상)를 기준으로 작성된 경로 상대경로는 '내가 기준으로 삼고 싶은 디렉토리'를 기준으로 '다른 디렉토리(또는 파일)'가 어디에..
변할 수 있는 임의의 값, '변수'를 생성하기 위해 자바스크립트는 var, let, const 라는 키워드를 제공한다. ES5까지는 var 키워드만 사용되었는데, ES6부터는 let과 const도 이용하여 변수를 생성할 수 있다. 그렇다면 왜? 굳이 let과 const라는 키워드를 추가하여 변수를 만들 때 셋 중 하나를 선택하게 해두었을까? var 아이스크림이라는 변수를 var로 생성하고, 500이라는 값을 주었다. 따라서 콘솔로 찍어보면 아이스크림은 500이라는 값이 나온다. 이때, 변수 빵이 가지고 있는 값이 1000 이상이라면, 아이스크림이라는 변수를 다시 선언하여 1000이라는 값을 부여한다. if문의 괄호 시작, 끝 점이 끝났으므로 if문 안에서 선언된 var 아이스크림 = 1000;은 괄호 밖..