분류 전체보기

11/22 (정렬과 자료 구조, 화) TIL

2022/11/22 화 정렬 방법: 버블 정렬 : 꽉 막힌 O(N2)O(N^2)O(N2) “둘 둘을 끝까지 비교 비교하는 모양이 버블 버블해서”선택 정렬: 꽉 막힌 O(N2)O(N^2)O(N2) “최솟값 널 선택한다! 이리 앞으로 와!”삽입 정렬: O(N2)O(N^2)O(N2)인데 잘하면 Ω(N)Ω(N)Ω(N)만에도 끝남. “저 신입인데… 어디로 가면 되나요?” 병합 정렬: O(NlogN)O(NlogN)O(NlogN) “원자 단위로 해체했다 다시 되돌아오는 이것은… ‘원상 복구’를 장담하지 않는 텔레포트” 자료 구조:스택 stack큐 queue해시 hash table → 충돌 해결 방법에 체이닝(Chaining)과 개방 주소법(Open addressing)이 있다. 푼 문제: 너무 많아 일일이 ..

11/21 (시간 복잡도, 월) TIL

2022/11/21 월자료구조 강의 공부를 시작했다.개념: 시간복잡도, 공간복잡도, 점근 표기법(빅 오, 빅 오메가 표기법)푼 문제:최댓값 찾기최빈값 찾기숫자 존재하는지 찾기더하기와 빼기로 최댓값 만들기중복되지 않는 첫 문자 찾기 소수 찾기1과 0 뒤집기 문자열 요약하기 Uploaded by N2T

11/18 (01.미니 프로젝트 KPT 팀 회고, 금) TIL

2022/11/18 금KPT 회고 - 프로젝트를 마무리하며...PROJECT OVERVIEW각 팀원을 소개하는 미니 홈페이지 구현방명록을 작성하고 보여주는 기능 구현상기한 기능을 Restful하게 POST와 GET 방식으로 요청하도록 API 구현메인 페이지에 방명록 노출/닫기/시간순 정렬 기능 구현 KEEP 다음 프로젝트에서도 유지하고 싶은, 좋았던 부분:팀원 에러에 적극 참여하여 지원하기기능 구현에 집중하기가끔 쉬는 시간 갖기팀원과 대화 많이 하기 PROPBLEM 문제였던 점, 원인과 해결 방안:문제점 : 효율적인 시간 활용 (에러에 투자한 고민 시간이 너무 길어, 촉박한 진행이 이루어짐)해결 방안 : 튜터 & 매니저님의 도움받으며 제한된 시간에 프로젝트 마무리 TRY 더 해보고 싶은 것, 더 추가하고..

11/17 (목) TIL

2022/11/17 목마침내 자정을 넘겨 하루가 마감되는 날들이 도래했다…. 개인 페이지를 억지로라도 마무리했고, 오늘은 하루 종일 팀 메인 페이지를 다같이 만들었다. 각자 맡은 파트 구현은 오전 즈음에 다 끝났는데 합치고 하나로 만드는 과정에서 오래 걸렸다. 메인 페이지 html이 다 완성 되고 공유받은 것에 마지막 댓글 달고 보여주기 기능을 붙여넣었다. 각 페이지의 어디에 어느 코드를 복사 붙여넣기 해야 할지 만반의 준비를 하고 있었기에 후딱 할 수 있을 줄 알고 내가 하겠다고 자원했다. 그러나가 역시나 후딱은 무슨. 이상하게 동작하는 부분이 몇 있었고 모두 합심해서 고쳤지만… 블랙님과 핑크님(←? 자아 분열중…) 페이지에서 대체 왜!! 댓글 달기 버튼이 실행이 안되는지. 그걸로 마지막 2시간 즈음을..

11/16 (수) TIL

2022/11/16 수개인 페이지 진행 상황: 만든 것:댓글을 보였다가 감출 수 있게 만들었다.마우스 오버시 카드 커짐 + 내용물이 변했다는 걸 알리기 위해 카드 배경색 바꿔줌.gif도 img태그에 들어갈 수 있다는 것을 발견!카드마다 마우스 오버시 함수를 둘 씩(들어오면, 나가면) 만들어주고 있다;;;이미지와 움짤을… 구하고 돌아다닌 시간 ≥ 코드 구상한 시간저 위에 할아버지들은 홈버튼 구현하기 위해 임시로 삽입해 테스트해본 이미지들이다. 나중에 없앨 것이다. 만들어야 할 것:내용물 채워넣기 - 장점, 추구하는 개발자 상. 댓글 지우기 기능도 넣기? 근데 아무나 지우면 안되니까 비번? 안되겠다. 그냥 못 지우는 걸로 하자. 대신 ‘이걸로 포스팅하시겠습니까?’확인창 하나 넣자. 다시 메인 페이지로 돌아갈..

11/15 (화) TIL

2022/11/15 화GIT 버전 관리를 시각화해서 볼수 있는 방도를 찾아 헤맸다. 개발 과정을 기록할 때 ‘여기까지 한 작업은 이렇다’하고 깃 브랜치와 커밋 이미지를 한 장 딱 박아놓으면 한 눈에 롤백할 부분을 찾아가기가 편할 것 같아서. 몇 가지 후보를 알아냈지만 강사님이 보여주신 다이어그램은 손수 그리신 걸로 판명남. 커밋과 브랜치의 로그를 시각화 하는 걸 Directed Acyclic Graph(DAG)라고 부른다. 보통 손수 그리는 수밖엔 없는데,살펴본 방법들: Git GUI, SourceTree, GitKraken, Git Flow Chart, Git Fork. 4번이 가장 깔끔하고 단순해 보이고, 3번과 5번도 비교해봐야겠다.파이참에서 갑자기 app.py가 실행이 안됨. 어디선가 app (1..

[책] CH10 리액트 라이브러리 맛보기

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다.(이 파트는 대강 정리하고 넘어간다) 목차리액트의 기본요약: 리액트 라이브러리 React Library리액트 라이브러리 사용 준비바벨을 적용하겠다고 선언하기루트 컴포넌트 출력하기컴포넌트 componenet컨테이너 containerJSX(JavaScript XML: 자바스크립트 확장 문법)클래스 컴포넌트컴포넌트의 기본적인 속성과 메소드자주 (오버라이드해서)사용되는 메소드: 자주 (변경해서)사용되는 속성:컴포넌트에 이벤트 연결하기이벤트 연결 템플릿스타일 지정하기컴포넌트 배열리액트와 데이터요약:여러 개의 컴포넌트 사용하기부모에서 자식의 state 속성 변경하기자식에서 부모의 state 속성 변경하기리액트로 만드는 할 일 목록 애플리케..

11/14 (내배캠 첫날, 월) TIL

2022/11/14 첫날, 월미니프로젝트 발제를 안내받음프로젝트마다 S.A.(Starting Assignments)라는 걸 제일 처음 작성한다는 걸 알게 됐다. S.A.의 구성 요소로는 프로젝트명과 간단한 설명, 프론트적으로는 간략한 청사진, 그리고 백엔드쪽으로는 필요 API들을 작성한다.(그렇지만 starting assignment라는 용어 자체로는 검색이 안 되던데..? 비슷한 개념의 다른 이름의 정의가 있을 것 같음.)GIT 특강 2시간 들음깃에게는 3가지 공간이 필요하다: 폴더와 파일들을 다 벌려놓고 작업하는 작업대(작업 디렉터리), 다음 버전으로 포장해 내 갈 품목들을 선별해 올려 놓는 컨베이어 벨트(스테이지), 마지막으로 컨베이어 벨트에 올려진 애들이 다소곳이 포장되어 전달되는 창고(저장소)...

[책] CH9 클래스 part2(끝). 클래스 고급

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차클래스의 고급 기능요약: 상속 inheritance애플리케이션 개발자프레임워크 개발자 (엔진 개발자) private 속성과 메소드게터와 세터클래스 선언할 때(프레임워크 개발자):사용할 때(애플리케이션 개발자): static 속성과 메소드오버라이딩 overridingalert()의 출력 형태 바꿔보기 클래스의 고급 기능상속, private 속성/메소드, 게터/세터, static 속성/메소드, 오버라이드요약: ☝🏿클래스 내부에서 인스턴스를 가리키는 “this.”, 자기자신 클래스를 가리킬 땐 “클래스명.”☝🏿상속은 extends 프라이빗은 # 정적은 static 게터와 세터는 get, set 부모의 메소드를 가리킬 땐 supe..

[책] CH9 클래스 part1. 클래스의 기본 구성

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다.목차클래스의 기본 기능요약: 객체 지향 패러다임추상화 abstraction1. 같은 형태의 객체 손수(노가다로) 만들기2. 객체를 활용하는 함수3. 객체의 기능을 메소드로 추가하기4. 객체자체도 함수로 생성하기5. (마침내) 클래스(로) 선언하기객체 지향 프로그래밍 Object Oriented Programming클래스 class프로토타입 prototype인스턴스(객체) instance생성자 constructor 메소드 method 클래스의 기본 기능객체 지향 패러다임, 추상화, 클래스, 인스턴스, 생성자요약: ☝🏿class Student { 키:값 … 키:값, 메소드1{} 메소드2{}… }와 같이 클래스를 선언한다.☝🏿cons..

[책] CH8 예외 처리

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차구문 오류와 예외요약: 오류의 종류1. 구문 오류 syntax error2. 예외 exception (런타임 오류 runtime error)예외 처리 exception handling1. 기본 예외 처리2. 고급 예외 처리예외 처리 고급요약: 예외 객체 exception object예외 객체의 속성throw 구문“자바스크립트는 예외를 잘 발생시키지 않아요. 아주 얌전하죠”try 구문 안에서 throw로 던진 에러도 catch가 받을까? 구문 오류와 예외구문 오류, 예외(런타임 오류), 예외 처리, try cath finally 구문요약: ☝🏿오류에는 구문 오류와 런타임 오류(=예외) 두 가지가 있고☝🏿그 중 런타임 오류를 ..

[책] CH7 문서 객체 모델(DOM)

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차문서 객체 조작하기요약:DOMContentLoaded 이벤트문서 객체 가져오기문서 객체 생성하기문서 객체 이동하기문서 객체 제거하기문서 객체 내부를 조작하기글자 조작속성 조작스타일 조작이벤트 설정하기이벤트 연결 생성하기이벤트 연결 제거하기이벤트 활용요약:이벤트 모델 event model표준 이벤트 모델고전 이벤트 모델인라인 이벤트 모델키보드 이벤트이벤트 발생 객체글자 입력 양식 이벤트입력 양식 form드롭다운 목록체크 박스 라디오 버튼 기본 이벤트 막기할 일 목록 만들기아주 강력한 글자 수 세기 프로그램localStorage 객체 문서 객체 조작하기실제 HTML문서에는 내용을 입력하지 않고도 자바스크립트 쪽에서 body태그..

[책] CH6 객체 part4(끝). 다중 할당과 깊은 복사

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차객체와 배열 고급요약:속성 존재 여부 확인배열 기반의 다중 할당객체 기반의 다중 할당다중 할당 (구조 분해 할당) 활용 예시얕은 복사: 참조 변수만 바꾸기깊은 복사: 내용물도 복사배열 전개 연산자로 깊은 복사하기객체 전개 연산자로 깊은 복사하기전개 구문 spread operator객체와 배열 고급속성 존재 여부 확인, 다중 할당, 얕은 복사(참조 복사), 깊은 복사 요약:☝🏿“객체.속성1”의 값이 null이나 NaN, 0, “”가 아니라는 게 확실하면 if (객체.속성1)로 속성1의 존재 여부를 확인하고(확실치 않다면 if (객체.속성1 !== undefined)로),☝🏿할당 연산자 오른쪽에 배열이나 객체를 써서 다른 배열..

[책] CH6 객체 part3. 외부 라이브러리 연결

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차외부 script 파일 읽어들이기외부 자바스크립트 파일 뭉치 - Lodash 라이브러리CDN (Contents Delivery Network) 이란…min 버전이란…이름이 왜 ‘Lodash’인가 외부 script 파일 읽어들이기프로그램이 커지면 html파일에서 로 외부 자바스크립트 파일을 읽어들이면 된다.HTML 파일은 위에서부터 아래로 태그를 읽어들이면서 차근차근 처리하기 때문에, 위에 있는 // 콜렉션(배열과 객체)에 적용 가능한 _sortBy(): => 결과: (4) [{…}, {…}, {…}, {…}] 0 : {user: 'barney', age: 36} 1 : {user: 'barney', age: 34} 2 : ..

[책] CH6 객체 part2. 기본 자료형과 승급

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차객체의 속성과 메소드 사용하기요약: 객체 자료형 object일급 객체 first-class object(citizen)기본 자료형 primitives(primitive types)기본 자료형을 객체로 선언하기기본 자료형의 일시적 승급프로토타입으로 메소드 추가하기대표 객체들 - Number, String, JSON, MathNumber 객체에서 자주 쓰는 메소드:String 객체에서 자주 쓰는 메소드:JSON 객체에서 자주 쓰는 메소드:Math 객체에서 자주 쓰는 메소드: 객체의 속성과 메소드 사용하기기본 자료형, 객체 자료형, 기본 자료형의 승급, prototype요약: ☝🏿클래스 속성 Math.PI등과 ☝🏿인스턴스 속성 ..

[책] CH6 객체 part1. 객체 만들고 사용하기

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 목차객체의 기본요약:객체속성과 메소드동적으로 객체 속성 추가/제거메소드 간단 선언 구문객체 구조 분해 할당자유로운 this 객체의 기본요소, 속성, 메소드, this, 동적 속성 추가/제거요약:☝🏿객체를 만들 때: { 키:값, 키:값, }형태 안에, ☝🏿키로는 식별자와 문자열을 선언할 수 있고(기존의 식별자가 아니어도 된다),☝🏿값으로는 뭐든지 올 수 있는데 함수가 오면 메소드, 그렇지 않으면 속성이 되며,☝🏿메소드를 선언할 땐 익명 함수의 일반적인 축약형인 화살표 함수가 아니라 메소드 전용 축약형인 메소드 간단 선언 구문을 쓴다. ⇒ 키( ) { 함수 내용 }☝🏿객체를 다 만들고서 사용할 때:☝🏿값을 불러올 땐 객체[’키’]..

[책] CH5 함수

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다.목차함수의 기본 형태요약: 익명 함수 선언적 함수 매개변수와 리턴값기본적인 함수 예제윤년을 확인하는 함수A부터 B까지 더하는 함수최솟값 구하는 함수나머지 매개변수 rest parameter나머지 매개변수와 일반 매개변수 조합하기매개변수의 자료형에 따라 다르게 작동하는 getMin()함수전개 연산자 spread operator기본 매개변수구버전 자바스크립트에서는…나머지 매개변수가 없었다전개 연산자가 없었다기본 매개변수도 없었다한마디로 함수에 일반 매개변수밖에 못 썼다. 부를 때도 마찬가지.함수 고급: 함수를 매개변수로 전달하는 특성요약: 콜백 함수 callback function선언적 함수를 콜백으로 사용하기:익명 함수를 콜백으로..

[책] CH4 배열과 반복문

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. 배열요약:💡자바스크립트의 배열에 들어가는 요소는 타입이 혼합될 수 있다.💡배열을 만들고, 요소를 가져오고/추가하고/제거하고, 길이를 파악할 수 있다.💡저런 작업들은 작업 후에 배열의 내용이 바뀌는 파괴적 처리가 대부분이고, 비파괴적 처리라면 filter() 메소드가 대표적이다. 배열 만들기: 배열의 요소로 어떤 타입이든 다 들어갈 수 있다. (파이썬과 비슷)> const array = [23, 'Fire!', true, function () {}, {}, [1,2]] (6) [23, 'Fire!', true, ƒ, {…}, Array(2)] 배열에서 가져오기> typeof array[3] 'function'인덱스 자리에 계산식..

[책] CH3 조건문

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. if 조건문if 조건문자바와 마찬가지로 한줄 짜리 실행 문장은 중괄호를 생략 가능하다.스치듯 지나간 시각 객체 Date의 메소드들getFullYear() // 2022getMonth() // 1월이면 0을 반환함getDate() // 1getHours() // 21getMinutes() // 18getSeconds() // 38if else 조건문 중첩 조건문 if else if 조건문 ‘조건’이 한 문장이라면 if 조건문에서 중괄호를 생략해도 된다는 점에 기인하여 중첩 조건문에서 중괄호를 생략한 형태가 if else if 조건문이라고?? 분명 ‘실행’할 문장이 하나일 때 중괄호를 생략할 수 있다고 써져있는데(p131, 133..

[책] CH1 자바스크립트 시작

※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다. Statcounter - 웹 브라우저 점유율:Browser Market Share Worldwide | Statcounter Global StatsThis graph shows the market share of browsers worldwide based on over 5 billion monthly page views.https://gs.statcounter.com/browser-market-sharehttps://gs.statcounter.com/browser-market-share 자바스크립트 식별자 규칙⭐키워드는 안됨숫자로 시작도 안됨특수문자는 _와 $만 허용 (”_alpha”, “$alpha”, “_”, “$”도 가..