분류 전체보기141 Git · GitHub 시작하기_1. 깃허브 회원가입 [ GitHub 가입 후 로그인] - GitHub 주소 : github.com [ Settings ] 1. Settings - Public profile에서 Public email 설정하기 - 처음에는 Public email 설정이 불가하게 되어있다. - 그럴 경우, 'email settings' 를 클릭하여 'Keep my email addresses private'에 check를 풀어준다. - 다시 돌아오면 'Public email' 선택이 가능 하다. 이메일 선택 후 Update profile 한다. - 개인 github 프로필을 잘 꾸며주는 것이 좋다. * 본 포스팅은 'Git과 GitHub 시작하기'_인프런 호눅스님 강의를 참고하였습니다. 2022. 4. 6. 드림코딩_자바스크립트_쇼핑몰 미니게임 클론코딩 [ 쇼핑몰 미니게임 클론코딩 ] 1. HTML / CSS 정적인 페이지 완성시키기 ellie와 내 코드를 비교한 결과 및 보완해야 할 점 - 일정한 수치값을 변수로 사용하여(통일성 있게) 재사용 한다. - 각각의 태그별 class를 거의 대부분에 사용하여 css를 적용시킨다. - 가로 세로정렬 모두 flex를 사용해 더 간편하게 정렬하였다. - 쇼핑 리스트 ul>li 하나를 먼저 구현해 놓고 추후 JS에서 동적으로 변경하였다. - section.class 사용하여 섹션을 구분한다. (div_con사용x) - div_con 감싸지 않고 바로 tag 사용(ex, 바로 ul>li사용, 간단한 프로젝트라 그런 것 같다.) 2. data폴더 안에 data.json 파일 생성하여 data 보관하기 JS에서 배열을 .. 2022. 4. 2. 자바스크립트 기초(ES5+)_비동기의 꽃 JavaScript async와 await / 유용한 Promise APIs [ async · await ] Promise를 조금 더 간편, 간결하게 동기적으로 실행되는 것처럼 보이도록 도와주는 것 > 깔끔하게 Promise 사용하는 법 Promise chaining(.then)을 계속 사용하면 코드가 난잡해지는 것을 좀 더 간편한 API인 async와 await을 이용하여 동기식으로 코드를 순서대로 작성한 것처럼 작성할 수 있도록 도와준다. 기존에 존재하는 Promise 위에 간편한 API를 제공 한다. > *syntactic sugar(ex : Class > 프로토타입을 베이스로하여 그 위에 살짝 덧붙여진 것) Promise를 무조건 대체x > async를 사용할 경우에 따라 더 깔끔한 경우에 사용한다. *syntactic sugar : 문법에 설탕을 뿌려 더 달콤하게 사용한.. 2022. 3. 30. 자바스크립트 기초(ES5+)_비동기 처리의 시작_콜백(Callback) 이해하기(콜백지옥) [ 동기(Synchronous)와 비동기(Asynchronous) ] 1. 동기와 비동기 1) 동기(scynchrounous) : JS는 동기적이다 > hoisting이 된 이후부터, 코드가 우리가 작성한 순서에 맞춰서 하나하나씩 자동적으로 실행된다. *hoisting : var변수 또는 함수 선언이 가장 최상위로 올라가는 것 2) 비동기(asynchronous) : 언제 코드가 실행될지 예측할 수 없는 것을 말한다. 3) 콜백(callback) : 해당 함수 호출 시 지정된 콜백함수를 인자로 전달하여 지정 함수를 부르도록(call back)한다. -동기/비동기 // 1. 동기 : synchronous console.log("1"); console.log("2"); console.log("3"); // .. 2022. 3. 24. 자바스크립트 기초(ES5+)_유용한 배열(Array)함수 10가지(*중요) [ 유용한 배열(Array) 함수 ] 1. join() > 배열에있는 모든 아이템을 더해서 string으로 리턴함, 각각 구분자''를 통해 ,으로 구분하여 string으로 만들어준다. // Q1. make a string out of an array const fruits = ["apple", "banana", "orange"]; // answer const result = fruits.join(); const result1 = fruits.join("|"); // 구분자 '|'생성 console.log(result); console.log(result1); - 나 : toString() 사용, 차이가 무엇일까? 2. split() > 전달된 구분자''를 통해 string을 여러가지 문자열로 잘게 나뉘어.. 2022. 3. 23. 자바스크립트 기초(ES5+)_Array(배열)과 APIs [ Array 배열 ] 1. 자료구조 자료구조 : 비슷한 구조의 데이터들을 모아놓는 것이다. 자료구조와 Object의 차이점 : - object가 토끼와 당근일 경우 , 토끼와 당근들은 각각의 특징들이 있다. (property=귀 두개, 주황색, method=먹는다, 뛴다), object는 서로 연관된 특징과 행동들을 묶어놓는 것이다. 비슷한 타입의 object들을 묶어놓는 것을 자료구조라고 한다.(토끼들끼리, 당근들끼리 바구니에 담음) > 다른 언어에서는 동일한 type의 object만 담을 수 있다. but js는 유연한 언어(dynamic typed language)기 때문에 한 바구니 안에 다양한 type의 데이터를 담을 수 있다.(가능하긴 하지만 프로그래밍에 좋지 않다.) 자료구조와 알고리즘의 .. 2022. 3. 21. 이전 1 ··· 20 21 22 23 24 다음 728x90 반응형