본문 바로가기

Frontend Study - 2

 (94)
Git 사용법 Process 1. Master에서 clone을 받아온다. : 터미널창에서 git clone http://주소. 2. local 에서 branch 만들기 : git branch feature/login(이름) clone 받고 master 건들지 말고 branch 를 만들고 거기로 checkout 한 이후에 작업을 진행하는 것. 3. 현재 작업위치 master에서 branch로 이동 : git checkout feature/login * 주의 - 브랜치가 아닌 마스터에서 코드를 수정하거나, 삭제하거나 ,코드를 입력하지 말 것. 마스터에서는 pull만 받는다고 생각하면 된다. 4. 이동이 잘 되었는지 확인 : git branch 5. 작업 후 수정사항들 스테이징 영역(staging area)에 추가 : git add . ..
22.06.22 TIL 매개변수(parameter)와 인자(argument) 함수가 외부에서 입력 받은 데이터를 처리하는 경우 정의된 함수의 소괄호 내부에 name 이라는 단어가 들어 있습니다. 이처럼 함수 이름 옆 소괄호 자리에 적혀 있는 단어는 **매개변수(parameter)**라고 부릅니다. function getName(name) { return name + '님'; } 매개변수는 외부로부터 들어오는 값을 담아 함수 내부에서 사용하도록 하는 변수의 역할을 합니다. 함수 외부로부터 들어온 값이 담길 '자리' 혹은 **'변수의 이름'** let result1 = getName('개발자'); console.log(result1); // 콘솔에 '개발자님'이 출력 한 번 만든 함수는 여러 번 호출할 수 있습니다. 반환값을 변수..
인터넷이란 무엇인가? 인터넷이란 무엇인가? 인터넷은 세계에서 가장 많이 쓰이는 컴퓨터 네트워크 입니다. inter (~간의) + net (네트워크) '네트워크 간의'를 의미하며 네트워크와 네트워크를 연결한다는 의미로 쓰입니다. 네트워크간의 연결, 네트워크의 네트워크라는 뜻을 지니고 있습니다. 인터넷의 특성 중 하나는 분권적이라는 것입니다(Decentralization). 누구도 인터넷을 소유하거나 컨트롤 할 수 없습니다. 각각의 조직들이 그들의 네트워크를 만들어 사용자들에게 제공하고, 상호 접속 규약에 대하여 협의 합니다. 많은 사람들이 인터넷을 사용하며 웹 브라우저를 이용하기 때문에, 사람들은 인터넷이 웹과 동일한 것이라고 생각하는 경우가 있습니다. 하지만 사실 웹은 전자 메일과 같이 인터넷 상에서 동작하는 하나의 서비스 ..
자바스크립트 / for ... of & for ... in 차이점 1. for of for...of 명령문은 반복가능한 객체 (Array, Map, Set, String, Typedrray, arguments 객체 등을 포함) 에 대해서 반복합니다. 객체 데이터 값에 대한 순회. const array1 = ['a', 'b', 'c']; for (const element of array1) { console.log(element); } // expected output: "a" // expected output: "b" // expected output: "c" for (variable of iterable) { statement } variable : 각각의 순회 요소들은 각각 변수에 할당됩니다. 변수들은 const, let을 통해 선언될 수 있습니다. iterable..
자바스크립트 string methods - substring() / slice() / splice() 차이점 1. substring() substring() 메소드는 string 객체의 시작 인덱스(포함) 부터 종료 인덱스 전(불포함) 까지의 부분 문자열을 반환(return) 합니다. str.substring(indexStart[, indexEnd]) indexStart : 반환문자열의 시작 인덱스 indexEnd : (옵션) 반환문자열의 마지막 인덱스 (포함하지 않음.) const str = 'Mozilla'; console.log(str.substring(1, 3)); // expected output: "oz" console.log(str.substring(2)); // expected output: "zilla" 만약 indexEnd 가 생략된 경우, substring() 문자열의 끝까지 모든 문자를 추..
브라우저 : 웹스토리지 (web storage) - 로컬스토리지(local storage), 세션스토리지(session storage) / 쿠키(cookie) 비교 1) Application(응용프로그램) 패널이란? 크롬 Ver. 브라우저에서 (mac 단축키) cmd + opt + i => application 브라우저 저장소의 기능 웹 SQL 데이터베이스, 로컬 및 세션 스토리지, 쿠키, 어플리케이션 캐시, 폰트, 스타일시트를 포함한 로딩된 모든 리소스를 검사 2) Cookie 란? 쿠키는 웹사이트 접속시 접속자의 개인장치에 다운로드 되고 브라우저에 저장되는 작은 텍스트 파일입니다. 쿠키는 사용자가 방문한 웹사이트에서 사용자의 브라우저에 전송하는 작은 텍스트 조각입니다. 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송합니다. 쿠키가 있으면 웹사이트에서 사용자의 방문에 관한 정보를 기억하여 다음번에 사이트에 ..
브라우저 - 개발자도구 : 네트워크 / chorme browser - DevTools : Network 크롬 Ver. 브라우저에서 (mac 단축키) cmd + opt + i => network - status : 상태 200이면 정상 -> 각 숫자별 오류 확인 https://developer.mozilla.org/ko/docs/Web/HTTP/Status 1) 빨간색 점을 통해 레코딩이 진행된다. 다시 클릭하면 기록을 멈출 수 있으며 정지되기 전까지 주고받은 모든 Network 요소를 보여준다. 오른쪽 🚫을 클릭하면 기록된 모든 요소를 지운다. 2) Filter▽와 Search🔍는 이름과 같이 필터링하고, 검색하는 기능. Filter는 네트워크 소스를 타입별로 볼 수 있으며, 대체로 Fetch/XHR 이 주로 사용된다. 별도의 Filtering 방식을 : 예를들어 HTTP Method 가 GET 인 인터페..
22.06.23 TIL - 컴퓨터처럼 사고하는 것이 무엇인지 설명할 수 있다. 논리적이며 순차적으로 해결할 수 있도록 문제를 구조화 한다. 작게 쪼개어 분석, 해체, 과거의 문제들과 어떤 연계가 되는지 패턴을 이해 문제를 이해하고, 문제를 작게 분해해서 어떻게 해결할 지 생각해보자. 개발자란? 문제를 해결하는 사람. - 객체의 키에 동적(변수)으로 접근하기 Object 두번째 강의에서, 객체의 키를 사용하는 여러 방법을 배웠습니다. 이 방법을 사용하면 객체의 특정 키의 값을 가져오는것도 가능하지만, 반대로 객체에 특정 키를 만들고 값을 할당하는것도 가능합니다. const information = { name: '김개발' } 여기에 키 하나를 생성하고, 그 키에 값을 할당해주려고 합니다. 그런데 키와 값을 변수를 통해 받아온다면..

티스토리툴바