본문 바로가기

전체 글402

[ONEBITE-REACT] JS 기본 - 자료형 (Data Types) 의미 자료형 = type(집합). 1, 2, 3, 4 등의 숫자들이 모이면 '숫자', "사과", "배" 등의 문자들이 모이면 "문자"라는 집합으로 묶을 수 있는 것처럼, 자료형은 자료들의 공통된 성질을 나타낸다. 자바스크립트에서의 자료형 종류 자료형 (DataType) 원시 타입 Number String Boolean Null Undefined 객체 타입 Object Array Function RegexExp 원시 타입 (기본형 타입) Number Type(숫자) 모든 숫자롤 의미한다. 정수, 실수, 음수 모두 Number Type이다. 숫자로 보이지 않는 무한대, NaN도 number 타입이다. Number Type은 사칙연산과 나머지 (모듈러 연산) 계산이 가능하다. // 모든 숫자는 Number 타.. Programing/React 2024. 3. 11.
2024-03-10 용어를 바로 잡아 가는 중 나는 지금까지 전혀 다른 환경에서 전혀 다른 업무들을 해왔었다. 하나의 일을 꾸준히 오랫동안 하지 못했다는 아쉬움은 남지만, 다양한 일을 접해봄으로써 새로운 환경에 적응하는 방법이나, 빠르게 새로운 일을 학습하는 방법에 대해서는 몸으로 익힐 수 있었다는 점은 배울만 했다. 학교가 아닌 보수를 받고 하는 일로써 경험했던 것은, 군인 ☞ 영업사원 ☞ 마케터 ☞ 택배 ☞ 기획자 순이다. 그리고 지금 웹 개발자를 도전하고 있다. 짧은 기간이었지만 다양한 일과 환경에서 일을 해봤던 것에 대해서는 스스로 만족하고 있고, 새로운 환경에 접했을 때 남들보다 빠른 속도로 적응할 수 있었던 것은 분명 긍정적이었다. 하지만 30대에 접어 들면서 한 가지 일을 오래하여 전문성을 갖추지 못했다는 것에는 큰 아쉬움이 남는다. 그.. Programing/TIL 2024. 3. 10.
[ONEBITE-REACT] JS 기본 - 변수와 상수 변수와 상수의 의미 변수, 상수는 값을 저장하는 박스 변수 (var, let) 값을 계속 바꿀 수 있다. let age = 32; // let age ☞ 변수를 선언하다. = 32; ☞ 값을 초기화 하다. age = 34; // 변수의 값을 바꾼다. let age; // 변수의 값은 언제든 다시 바꿀 수 있기 때문에 초기화 하지 않고 선언만 할 수도 있다. let age와 같이 변수의 이름을 지정해주는 것을 변수를 선언한다고 한다. age에 32라는 값을 담는 행위를 초기값을 담는다고 하 값을 초기화한다고 한다. 변수는 값을 언제든지 다시 바꿀 수 있다. (변수명 = 초기화할 값) 변수를 초기화 하지 않고 선언만 하는 것도 가능하다. (let age;) 앞에서 한 번 선언된 변수는 똑같은 이름으로 선언할.. Programing/React 2024. 3. 10.
[ONEBITE-REACT] JS 기본 - VSCode 준비하기 VSCode 에디터 준비하기 VSCode 에디터를 설치한다. 코딩을 돕는 플러그인을 설치한다. prettier ctrl + s로 저장만 해도 코드를 자동 정렬해주는 플러그인 설치가 완료되면 윈도우는 커멘트 쉼표를 눌러 설정 검색창을 열고 format on save를 검색하여 아래 이미지처럼 체크한다. Error Lens 코드에 오류가 있을 시 해당 입력창에서 바로 오류를 보여주는 플러그인 Live Server ctrl + s만 누르면 현재 작업 중인 파일을 웹 브라우저에서 별도로 새로고침을 하지 않아도 띄워주는 플러그인. VSCode에서 ctrl + shift + P를 누른 후 live server라고 검색하여 Open with Live Server를 눌러 실행시켜 준다. 이 과정은 .js파일이 아니라 .. Programing/React 2024. 3. 10.
2024-03-08 네이버 홈페이지형 블로그 구축 서론 친한 동기가 창업을 했다. 심리학에서는 남이 잘 되는 것을 공감해주는 것이 남의 슬픔을 공감해주는 것보다 더 어렵다고 이야기 한다. 하지만 이 동기가 시장에서 성공하고 본인의 뜻을 이루면서 경제적 자유를 이루는 모습을 상상하면 대리만족도 되고, 나와 상황이 같진 않지만 그래도 비슷했던 동기가 어두컴컴한 시장으로 맨 몸으로 뛰어든 것을 보면 자신의 자유의지를 실현해나가는 모습에 존경심까지 든다. 이 동기는 장교로 군 전역을 하고, 전공인 회계를 살려 제조업체의 회계팀에 어렵게 입사하여 일을 하다 본인의 전공과 전혀 상관이 없고, 주변에서 접점도 전혀 없었던 방충망 교체 사업으로 1인 창업을 하였다. 누구나 마음 속으로만 품고 있는 것을 이 동기는 직접 몸으로 실천한 것이다. 그만한 내적 동기나 자본이.. Programing/TIL 2024. 3. 8.
[JS] (프로그래머스) (Lv.0) flag에 따라 다른 값 반환하기 문제 두 정수 a, b와 boolean 변수 flag가 매개변수로 주어질 때, flag가 true면 a + b를 false면 a - b를 return 하는 solution 함수를 작성해 주세요. 답지 function solution(a, b, flag) { var answer = 0; return answer; } 정답 function solution(a, b, flag) { var answer = flag ? a + b : a - b; return answer; } 해설 이것도 앞의 문제와 동일하게 삼항 연산자로 표현할 수 있다. 일단 문제에서 true면 이것, false면 저것이라는 표현이 있기 때문에 조건문이 사용된다는 것을 알 수 있다. 따라서 flag가 true면 a+b를, flag가 false.. Programing/CodeKata 2024. 3. 6.
[JS] (프로그래머스) (Lv.0) n의 배수 문제 정수 num과 n이 매개 변수로 주어질 때, num이 n의 배수이면 1을 return n의 배수가 아니라면 0을 return하도록 solution 함수를 완성해주세요. 답지 function solution(num, n) { var answer = 0; return answer; } 정답 function solution(num, n) { var answer = (num % n === 0) ? 1 : 0; return answer; } 해설 function을 사용해 soultion()이라는 함수를 만든다. soulution이라는 함수는 (num, n)이라는 두 개의 매개변수를 받는다. num가 n의 배수라는 것은 num을 n으로 나누었을 때 나머지가 없이 딱 떨어지면 배수인 것이고, 나머지가 발생하면 .. Programing/CodeKata 2024. 3. 6.
[코드팩토리] 클래스 기본기 (Class basics) 정의 사전적 정의 클래스는 객체지향 프로그래밍에서 특정 객체(인스턴스)를 생성하기 위한 변수와 메소드(함수)를 정의하는 일종의 틀이다. 코드팩토리 정의 정보를 일반화해서 정리하는 방법이다. 상세설명 예를 들어 아이브 멤버들의 이름으로 안유진, 가을, 레이, 장원영, 리즈, 이서라는 것을 알고 있다. 그리고 출생년도가 각각 2003, 2002, 2004, 2004, 2004, 2007년이라는 것을 알고 있다. 이것을 보면 우리는 두 개의 데이터를 알 수 있는 것이다. 사람의 이름과 출생년도. 이 이름과 출생년도라고 카테고리를 만든 것이 클래스가 된다. 그리고 안유진, 2003년 출생이라는 두 개의 클래스가 모여서 실제 사람 안유진을 만들어내게 되는데 이렇게 클래스가 모여서 만들어낸 것을 객체(인스턴스)라고.. Programing/JavaScript 2024. 3. 5.
[코드팩토리] try...catch 기본 개념 error를 잡는데 사용한다. 사용 하는 키워드는 아래와 같다. throw : 에러를 발생 시킨다 ☞ 에러를 '던진다' catch : 에러를 명시적으로 인지한다 ☞ 에러를 '잡는다' throw로 에러를 던지면 그 다음 코드는 실행되지 않는다. function runner(){ console.log('hello'); throw new Error('큰 문제가 생겼습니다!'); console.log('world'); // 위에서 throw로 에러를 던졌기 때문에 이 코드는 실행되지 않음. } runner(); throw로 던진 에러를 catch로 잡을 수 있다. function runner() { try { console.log('hello'); throw new Error('큰 문제가 생겼습니다!.. Programing/JavaScript 2024. 3. 5.
2024-03-05 자바스크립트 본격 시작 현재 HTML, CSS의 기본기를 배운 상태이고 직접 화면단을 구성하는 데는 스스로 백지상태에서부터 작성하긴 어려운 상태이다. 라이브러리나 구글링의 도움을 받아야 매끄러운 상태이다. 그러나 그렇게 얻은 코드를 보고 원하는 대로 수정할 수 있는 수준까지는 도달했다. 여기까진 그렇게 어렵진 않았다. 자바스크립트를 입문하는데 생각보다 시간이 오래 걸린다. 쉬운 부분은 금방 넘어가지는데 막히는 부분은 이해하기까지 꽤 오랜 시간이 걸린다. 도저히 이해가 안 되는 것은 4시간을 넘게 씨름하다 일단 넘겼다. 그리고 다음 날 다시 보니 신기하게 해답이 풀리는 것들이 있었다. for...while 반복문이 그러하다. 비전공 입문자인 내가 먼저 세운 전략은 일단 빠르게 어떤 것들이 있는지 스키밍 한 후 심화 학습에 들어가.. Programing/TIL 2024. 3. 5.