행복을 담는 블로그

📕 Javascript 문법 종합반 1주차 1. JS (자바스크립트) 언어의 역사 및 특징 ▶️ 언어 : 컴퓨터와 사람 사이 소통이 필요 🖥️ Javascript : 브라우저 동작 스크립트 언어 / 브라우저를 움직이게끔 하는 언어. 브라우저 : 자바스크립트를 통해서 많은 동적인 액션을 만들어낼 수 있다. 이를 제어하기 위해서 자바스크립트 언어가 생김. 1) 역사 2005년 AJAX 등장(javascript 기반의 기술) : 효율성, 속도 부족 -> 등장 이후 폭발적인 UX 향상 * UX (User eXperience): 사용자 경험. 사용자들이 얼마나 편리하게 사용하는가 2008년 V8 엔진 출시 (google) : 브라우저 속도 엄청나게 향상 ⬆️ 2009년 Node.js 등장 ▶️ FullStack ..

📕 Javascript 배열과 배열 메소드 1. 배열 (array) 생성 1) 기본적인 배열 생성 방법 객체는 그냥 just 나열 배열은 index(순서)를 가지고 있다. 0번째부터 시작 대괄호 [ ] : 배열 생성 쉼표(,) : 이용해서 구분 let fruit = ["사과", "바나나", "오렌지"]; console.log(fruit.length); // 3 2) 크기 지정 let number = new Array(5); console.log(number); // ▶️ 크기가 5인 배열을 만들어줘. 2.요소 접근 객체에서는 key로 접근 배열에서는 index로 접근 : [ ] 대괄호 안에 인덱스 값 입력 let fruit = ["사과", "바나나", "오렌지"]; console.log(fruit[0])..

📕 Javascript 객체와 객체 메소드 📌 객체 (object) 란? : key-value pair 형태를 가진 데이터 타입 하나의 변수에 여러개의 값을 넣을 수 있다! value에 올 수 있는 data type의 형식에는 제한이 없다! 1. 객체 생성 방법 1) 기본적인 객체 생성 방법 중괄호{} : 객체 생성 콜론(:) : key : value 작성 쉼표(,) : key-value pair 구분 let person = { name:'홍길동', age : 30, gender : "남자", }; 2) 생성자 함수를 이용한 객체 생성 방법 function Person(name, age,gender){ this.name = name; this.age = age; this.gender = gender; }..

📕 Javascript 조건문 - if, else if, else, switch 1. if 문 1) if 문 기본 형태 if (조건 : true 또는 false가 나올 수 있는 조건) { // main logic } ex 1) let x = 10; if (x > 0){ // main logic console.log("x는 양수입니다."); // x는 양수입니다. } ex 2) let y = "hello world"; // y의 길이가 5보다 크거나 같으면 길이를 console.log로 출력 if (y.length >= 5){ console.log(y.length); // 11 } 2) if - else 문 let x =-3; if(x > 0){ // main logic #1 : if 문의 조건이 true..

📕 Javascript 의 연산자 1. 산술 연산자 (arithmetic operators) : (+ , -, *, /, %) 더하기 연산자 : str(문자열)이 우세 그 외 연산자 : num(숫자)가 우세 1) 더하기 연산자 (+) console.log(1+1); // 2 console.log(1 + "1"); //문자열로 변환 // 11 2) 빼기 연산자 (-) console.log(1 -"2"); // -1 console.log(1-2); // -1 3) 곱하기 연산자 (*) console.log(2 * 3); // 6 console.log("2" * 3); // 6 4) 나누기 연산자 ( / ) console.log(4/2); // 2 console.log("4"/2); // 2 5) 나머지 연산..

📕 Javascript의 데이터 타입과 형 변환 ✅ Data type의 결정 : runtime (run 하는 time) 에 결정 = 코드를 작성할 때가 아닌, 실제 코드가 실행될 때 = 옆에 터미널에 코드가 실행될 때 ▶️ 그때 데이터 타입이 결정된다. ex) : String a ="abc"; // 이렇게 data type : String임을 표시해야함. : const a = "abc"; // 변수만 선언 1. Javascript의 데이터 타입(data type) 1) 숫자(number) 1️⃣ 정수 (int) let num1 = 10; console.log(num1); // 10 console.log(typeof num1); // number 2️⃣ 실수(float) let num2 = 3.14; co..

Git & GitHub 특강 내용 정리📚 1. 필수 리눅스 명령어 : git 명령어 아님 ✅ Terminal 열기 VScode > terminal > new terminal : 아랫쪽 terminal 나온거 확인 가능 🧐 기존에 진행 중인 프로젝트 파일이 있다면? File > New Window 를 이용하여 새 창 열어서 시작하기! 1️⃣ pwd(print working directory) : 내가 작업하고 있는 폴더를 보여줘! / 현재 위치 알려줘! ~ : root(루트)라는 경로 = 최상위 경로 우리가 보는 Desktop 보다 더 상위의 폴더 2️⃣ ls(list) : 내 폴더 안에 있는 폴더 & 파일을 볼 수 있음 3️⃣ ls -a(list all) : 숨겨진 파일(보통 .으로 시작함)도 모두 볼 ..

오늘의 공부📖 웹개발 종합반 강의 (2회독) 미니 프로젝트 발표 참석 WEB 특강 TIL 작성 오늘 공부한 내용 정리💁🏻‍♀️ 1. 복습한 내용 (기억 잘 안 나는 부분 + 강의 내용 정리 안 된 부분 다시 복습하기) [웹개발 종합반 1주차_미니 프로젝트(나의 추억 앨범 만들기)] 1️⃣ bootstrap 이용해서 카드 붙여넣기 → img src = "url" : 이미지 주소 붙여넣기 → title / text 내용 각각 알맞게 바꾸기! → class="col" 하나 = card 하나 (❗️내용 접어서 가독성 좋게 코딩하기) .. 2️⃣ posting box 만들기 : bootstrap > floating labels 가져오기 border가 아니라 shadow 만들기 이게 border shadow는 뭔가..