sooonlog

본 글은 초보개발자의 입장에서 작성된 글이며, 잘못된 설명이 포함될 가능성이 있습니다.

🙌잘못된 설명에 대한 지적이나 조언의 댓글을 환영합니다🙌

+ 22.04.28 오전 9시 내용 추가

어제 오후 6시 경 해당 부분을 수정하여 0.27.2 버전이 새로 릴리즈되었다. 

하지만 최신 버전을 적용했을 때 동일한 이슈가 아직도 발생된다는 사실을 확인하였으며,

안정화된 버전인 0.26.1을 계속해서 사용하기로 했다. 

Axios 개발자분이 0.27.0버전에서 데이터를 자동으로 처리하는 방식에 대한 내용을 해당 링크에서 확인할 수 있다고 언급해주셔서 추가해둔다. 시간될때 한번 더 확인해보고, 확실히 이해해야겠다. 

https://github.com/axios/axios#form-data

오류문구

POST http:://~~~~ 403

발생상황

어제 오후 3시까지만 해도 잘됐던 코드와 기능들이 오후 6시경 갑자기 동작하지 않는 에러 발생

form data를 axios.post로 넘겨주는 기능이 동작하지 않고 403 오류를 발생시킴

해결방안

(해결방안만 보고 싶은 분들을 위해 먼저 적어둡니다)

현재 프로젝트에는 unpkg CDN으로 Axios를 사용하는 중이었고, 현재 버전에 문제가 있어 이전 버전으로 연결시켰다.

<!-- 변경전 unpkg CDN 코드 -->
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

<!-- 이전 버전연결을 위한 unpkg CDN 코드 -->
<script src="https://unpkg.com/axios@0.26.1/dist/axios.min.js"></script>

 이것저것 코드들을 많이 수정한 터라 도대체 어디에서 문제가 생긴 건지 혼란스러웠다. 커밋하기 전에 분명 테스트해보고 동작이 정상적으로 된다는 것을 확인하긴 했지만, 그때까지만 해도 내가 작성한 코드가 완전무결하다는 것에 대한 자신감이 없었기 때문에 나부터 의심해볼 수밖에 없었다. 게다가 특정한 한 페이지에서만 동작이 안 되는 줄로 알고 있어서 이전에 동작이 잘 되었던 코드로 revert 해보기도 하고, 뭐가 문제인지 코드들을 다 뜯어보고 있었는데, 다른 페이지를 작업하고 있던 동료에게도 같은 문제가 발생하는 게 아닌가..! 그래서 코드의 문제는 아니라고 판명하고 왜 이런 오류가 발생하는지를 찾아내기 위해 엄청난 구글링을 시작했다. (사실 내 코드의 문제가 아님을 깨닫기까지 장장 4-5시간을 소모한 것 같다..)

 코드의 문제가 아님을 깨닫고 403 Error가 언제 발생하는지, 그리고 AxiosError가 나오는 상황은 도대체 어떤 상황인지를 파악하기 위해 수없이 많은 블로그 글을 보고 또 봤다. 그래도 해결이 안 돼서 마지막 방법으로 찾은 것이 바로 Axios 공식 깃헙이었는데, 우연히 거기서 정답을 찾게 되었다. (아, 이래서 많은 개발자분들이 공식문서 보는 습관부터 들이라고 하신 거구나 하고 이해하게 되는 순간이었다.)

 나도 내가 왜 그런 행동을 했는지는 모르겠지만, 무의식적으로 공식 깃헙의 History를 먼저 확인해 보았다. 그럴 가능성은 희박하겠지만, 혹시나 그 사이에 버전 업데이트가 되면서 제대로 동작하던 기능들에 문제가 생긴 것은 아닌지를 가장 먼저 체크해보고 싶었던 것 같다. 커밋 이력을 살펴보니 동작이 안됐을 것으로 추정되는 시각에 새로운 버전이 업데이트되었다는 사실을 알게 됐다. 이때부터였다. 막막했던 이 403 에러의 해결의 실마리가 보이기 시작한 것이 :)

 그다음에는 Issue 탭을 들어가서 최근에 올라온 이슈 중 우리가 겪은 상황과 비슷한 내용이 있는지를 탐색했다. 그렇게 찾은 것이 바로 이 이슈다.

https://github.com/axios/axios/issues/4638

 읽어보니 지금 내가 겪은 상황이랑 같았다. 0.27.1버전으로 업데이트 된 후에 axios.post로 formData를 받아오는 동작이 안된다는 내용이었는데, 이 이슈 글로 인해 동작이 안됐던 문제가 내 코드로 인한 것이 아닌, axios 버전 업데이트로 인한 것임이 분명하게 밝혀져 조금은 속 시원하기도 했다. 심지어 이전 버전의 CDN을 사용하는 방법까지 하단 코멘트로 친절하게 달아놓으셔서 당장 문제의 해결이 필요한 상황에서 큰 도움이 되었다. 최신 버전의 CDN을 사용하는 코드를 변경하니 바로 해결이 됐고, 조용한 사무실 한 켠에서 동료와 이슈 해결의 기쁨을 누렸다. 어떻게 보면 오늘 하루를 통째로 이것 때문에 날린 셈인데, 해결했다는 성취감이 이렇게 클 줄이야.. 이 맛에 개발하지😋

느낀점

 막상 정리하고 보니 이렇게까지 기뻐할 문제는 아닌 것 같기도 하다만, 그래도 답이 없다고 생각했던 문제를 끈질기게 포기하지 않고 직면한 결과를 해결이라는 즐거움으로 보상받은 것 같다. 역시 세상에 답 없는 문제는 없고, 내가 겪은 문제 중 대부분은 수많은 선배 개발자가 이미 겪고 해결해낸 문제라는 것을 오늘 다시 한번 깨닫게 된 것 같다.  

 또, 공식문서의 필요성과 영어로 된 문서를 읽어야 하는 필요성에 대해 절실하게 느끼게 된 계기였다. 사실 공식 깃헙을 조금만 더 빨리 봤었더라면 좋았을 텐데, 본능적으로 한글로 된 자료들만 찾아보다 보니 문제를 해결하는 데에 더 많은 시간이 소요된 것 같다. 앞으로는 공식문서를 먼저 보는 습관을 들여야겠다 ( •̀ ω •́ )✧

ps. 403 에러 해결에 어려움을 겪고 있다고 알렸을 때, 같은 회사도 아니지만 구글링에 함께 동참해준 동료 개발자분들에게 이 자리를 빌려 감사의 마음을 전해 본다. 그럼 이만~ ο(=•ω＜=)ρ⌒☆

오류문구

Context initialized 이벤트를 [org.springframework.web.context.ContextLoaderListener] 클래스의 인스턴스인 리스너에 전송하는 동안 예외 발생

발생상황

평소와 다름없이 서버를 켜고 작업을 시작하려던 차, 갑자기 이런 오류가 뜨면서 서버 실행이 안됐다. 

어제 퇴근하기 전까지만 했어도 잘 됐던 서버고, 출근하자마자 실행시킨거라 파일을 수정한 것도 없는데 안됐다.

도대체 왜 안되는지 감을 잡을 수도 없는 상황이었다 ╮（╯＿╰）╭

해결방안

내가 사용하는 STS4 에디터를 기준으로 설명되는 점인 것을 미리 알린다.

1. 프로젝트 우클릭 > Properties 클릭

2. Development Assembly > Maven Dependencies > 하단에 Apply(또는 Apply and Close)

3. 톰캣서버 재실행 하면 정상적으로 동작~!

처음 보는 오류에 당황해서 이것저것 구글링을 하며 다양한 방법을 시도해보려고 했으나,

혹시나 내가 프로젝트를 망쳐버리면 어쩌지 하는 두려움에 파일을 크게 건드리지 않는 선에서 시도해볼 수 있는 방법을 택해 이런저런 것들을 해봤다. 결국 해결이 안돼서 마지막 수단으로 컴퓨터 재부팅을 해봤는데 해결됐었던 오류였다.

그때까지는 몰랐지,, 이 오류녀석과의 끈질긴 인연이 시작됐다는 사실을 말이다🤦‍♀️

처음 위 오류를 접한게 3월 16일, 그리고 또 이 오류 녀석을 만난게 4월 12일이었다.

그래도 한 번 만나본 오류라고 의기양양해서 컴퓨터를 재부팅했는데도 서버 실행이 안됐다.

아니 왜 저번에는 됐는데~ 이번에는 또 안되는거냐고오.. 하면서 구글링에 다시 착수했다.

그래도 한달동안 이것저것 파일들을 만져보면서 프로젝트 수정에 대한 두려움이 조금 사라져서 그랬는지는 몰라도,

가장 효과적일 것으로 보였던 톰캣 서버 삭제 후 재설치 방법을 택해 수행해보았다.

다행히 다시 설치하니 제대로 또 동작했는데, 문제는 그 다음날에 발생했다.

다음날이 되니 또 이 짜식이 실행도 안되고 똑같은 오류를 내뱉는거 아니겠나..... _(:з)∠)_

그래서 톰캣 서버 삭제후 재설치를 하면 또 정상적으로 실행이 되고,,, 간헐적으로 이런 현상을 반복했어야했다.

그리고 오늘인 4월 20일 한동안 잠잠했던 이 오류가 또 아침부터 나를 괴롭혔다.

변경한 것도 없고 어제 퇴근하기 전까지만 했어도 잘 됐었잖아..😢 라고 생각하기도 잠시

도대체 같은 오류가 왜 몇번씩 발생하는걸까 하는 근본적인 궁금함이 생겨서 다시 구글링해 보았다.

그렇게 발견한 새로운 해결방법이 바로 위에 적어놓은 방법이다.

제게 새로운 해결책을 제시해주신 아래 사이트의 질문자님과 작성자님,, 계신 곳으로 절하겠습니다🙇‍♀️🙇‍♀️

https://www.egovframe.go.kr/home/faqinfo/faqinfoRead.do?menuNo=68&faqId=FAQ_0000000000000361 

항상 만수무강하시고 사는동안 행복하십쇼 ο(=•ω＜=)ρ⌒☆

느낀점

이 방법을 오늘 처음 시도해본 거라 앞으로 해당 오류가 또 발생할지 아닐지를 알 수는 없지만, 그래도 하나의 해결방법에 그치지 않고 다양한 해결법을 시도해보고 조금이나마 자바 프로젝트랑 친해진 기분이 들어서 좀 뿌듯한 것 같다. 만약 또 이 오류가 발생한다면 계속해서 방법을 수정해볼 예정이다! 많관부 많관부~(❁´◡`❁)

아직 완전히 이해못한 정적메서드와 인스턴스 메서드에 대한 개념은 조금 더 공부한 뒤에 수정해두어야겠다!

배열 🔥

• 자바스크립트의 배열은 자료구조의 배열과 같나요?
  • 아니오. 일반적인 배열은 각각의 요소가 동일한 데이터 크기를 가지며 연속적으로 이어져있다는 것이 특징입니다. 때문에 인덱스를 활용하여 효율적으로 임의접근이 가능하다는 장점이 있습니다.
  • 이에 비해 자바스크립트의 배열은 각 메모리 공간이 동일한 크기를 갖지도 않고, 연속적으로 이어져있지 않아도 된다는 `희소배열`의 특성을 가지고 있습니다. 쉽게 말하자면 `배열의 동작을 흉내낸 특수한 객체`라고 말할 수 있습니다.
• 배열의 메서드는 어떤 종류가 있나요?
  • 결과물을 반환하는 패턴에 따라 두 가지로 구분할 수 있습니다. 원본배열을 직접 변경하는 메서드와 원본배열을 바탕으로 새로운 배열을 생성해 반환하는 메서드가 그 종류입니다.
• 고차 함수에 대해서 아나요?
  • 고차 함수란, 전달 인자로 다른 함수를 받아오거나 함수의 실행 결과가 함수로 반환되는 함수를 이야기합니다.
• forEach 메서드와 map메서드의 차이점에 대해 알고 있나요?
  • forEach메서드는 콜백 함수를 인자로 받아 각 요소에 해당 함수를 실행합니다. 어떠한 값도 반환하지 않는 return 값이 undefined인 메서드인 것에 비해 map의 경우 콜백 함수를 인자로 받아 각 요소에 대해서 함수를 실행한 결과 값을 반환한다는 차이점이 있습니다.

프로젝트 준비로 한 주 건너뛴 할 수 있다! 자바스크립트 스터디 

지난주부터 실습을 나가느라 회사일 따라가기도 벅찼지만,

꾸준한 공부는 업무를 위해서도 필요하다고 여겨 

이번주는 딥다이브 9장과 10장의 내용을 읽고 개념을 정리했다!

타입 변환과 단축 평가🔥

• 명시적 타입 변환이 뭔가요?
  • 개발자가 의도적으로 값의 타입을 정해 변환하는 것을 말합니다.
• 명시적 타입 변환 함수를 예를 들어볼 수 있나요?
  • var a = (10).toString();
• 암묵적 타입 변환이 뭔가요?
  • 자바스크립트 엔진이 표현식을 평가할 때 코드의 문맥에 맞게 데이터 타입을 변환하는 것을 말합니다.
• truthy / falsy 한 값이 뭔가요?
  • 참과 거짓으로 명확하게 나누기 어려운 불리언 타입이 아닌 값을 암묵적으로 변환해야 할 때, 자바스크립트 엔진이 참으로 평가되는 값, 거짓으로 평가되는 값으로 판단하는 것을 이야기합니다.
  • falsy 값의 예로는 false, undefined, null, 0, -0, NaN, 빈 문자열이 있으며, 이것 외의 모든 값은 truthy값을 가집니다.

객체 리터럴

• 자바스크립트에서 객체란 뭘까요?
  • 객체의 상태를 나타내는 프로퍼티와 이를 참조하고 조작하는 동작인 메서드로 구성된 집합체이며, 변경 가능한 값을 말합니다. 상태와 동작을 하나의 단위로 구조화 시킬 수 있다는 장점이 있습니다.
• 함수와 메서드의 차이점에 대해 알고 계신가요?
  • 자바스크립트의 모든 함수는 객체이기 때문에, 값으로도 취급 가능합니다. 그래서 객체 안에 함수를 프로퍼티 값으로 활용하기도 하는데요. 이처럼 객체에 묶여있는 함수를 일반적인 함수와 구분하기 위하여 메서드라고 부릅니다.
• 자바스크립트에서 객체를 생성하는 방법은 어떤 것들이 있나요?

1. 중괄호 내에 0개 이상의 프로퍼티를 정의하는 객체 리터럴 방식

let a = { name: 'jang', age: 26 } 
console.log(a); // {name: 'jang', age: 26}

2. Object 생성자 함수를 사용하는 방식

let obj = new Object();

obj.name = 'jang';  // {name: 'jang'}
obj.age = 26;       // {age: 26}

console.log(obj);   // {name: 'jang', age: 26}

3. 생성자 함수를 사용하는 방식

function Person(name, age) {
	this.name = name;
	this.age = age;
}

const hs = new Person('jang', 26);
console.log(hs);  // Person {name: 'jang', age: 26}

4. Object.create 메서드를 사용하는 방식

const hs = Object.create(null, {
	name: {value: 'jang'},
	age: {value: 26}
});

console.log(hs);  // {name: 'jang', age: 26}

5. 클래스를 사용하는 방식 (ES6 이후 등장)

// class 선언 시 대문자로 시작
// class내에서 객체를 생성하고 초기화를 하기위해 단 하나의 constructor가 꼭 필요
// constructor은 자기를 생성한 부모를 가르킨다

class Intro {
	constructor(name, age){
		this.name = name;
		this.age = age;
	}
}

// 인스턴스 생성
const hs = new Intro('jang', 26);  

console.log(hs);    // Intro {name: 'jang', age: 26}

참조

객체(Object)와 객체를 생성하는 방법.

[TIL] JS : 객체를 생성하는 4가지 방법

코딩교육 티씨피스쿨

코딩교육 티씨피스쿨

팀프로젝트 마무리로 정신없이 1월을 보냈던 것 같은데, 벌써 과정이 끝난지 한달차에 가까워지고 있었다. 

몰입했던 멋사 과정도 마치고 잠깐의 휴식시간을 가졌으니 다시 공부를 시작할 때가 됐다고 생각했다.

그렇게 "할수있다! 자바스크립트" 스터디를 다시 시작하기로 했다.

책 한권을 빠른 시간 안에 습득하기로 했던 처음 목표와는 다르게 지금은 시간이 걸려도 개념을 놓치지 말고 가자는 쪽으로 의견이 모아졌다. 그래서 앞으로는 딥다이브 책의 한 부분을 골라 같이 보고, 공부해오기로 결정했다. 더불어 단순하게 발표하고 듣는 방식보다는 실질적으로 도움을 줄 수 있는 방향으로 스터디를 진행했으면 좋겠다는 의견이 있었다. 그래서 프론트엔드 기술면접 핸드북 에 나와있는 내용을 채워나가면서 공부하게끔 정했다.

이번주는 변수와 데이터 타입과 관련된 질문과 답변을 정리해보았다.

변수 🔥

• 변수란 무엇인가?
  • 하나의 값을 저장하기 위한 메모리 공간이며 이를 식별하기 위해 이름을 붙인 것
• 식별자란 무엇인가요? 🔥
  • 변수의 이름, 값을 구별할 수 있도록 하는 고유한 이름
• 변수를 선언한다는 것은 어떤 것을 의미하나요?
  • 메모리 공간을 확보하고, 변수명과 확보된 공간의 주소를 연결하여 값을 저장할 수 있게 하는 것
• var 키워드는 뭔가요?
  • 선언과 초기화 단계가 동시에 진행되는 변수 선언 명령어
• 호이스팅이 뭔가요? 🔥🔥
  • 선언문 등이 하위에 위치해있더라도 상위로 끌어올려진 것처럼 동작하는 JS고유의 특징
• var 키워드의 문제점은 무엇이 있나요? 🔥
  • 함수레벨 스코프를 지원하여 의도치 않은 전역변수 선언으로 인한 문제
• let 키워드는 var 키워드와 어떤 점이 다른가요? 🔥🔥
  • 선언단계와 초기화 단계가 분리되어서 진행
• TDZ 🔥🔥
  • Temporal Dead Zoned의 약어, 스코프의 시작 지점부터 초기화 시작 지점까지의 구간
• const 키워드는 어떤 특징이 있나요? 🔥
  • 재할당과 재선언이 불가능
• 식별자 네이밍 규칙은 어떤 것들이 있나요?
  1. 특수문자를 제외한 문자, 숫자, 언더바, 달러기호를 포함할 수 있다.
  2. 숫자로 시작할 수 없다.  
  3. 예약어를 식별자로 사용할 수 없다.
• 네이밍 컨벤션은 어떤 것들이 있나요?
  • 카멜케이스(firstName), 스네이크케이스(first_name), 파스칼케이스(FirstName), 헝가리안케이스(strFirstName)
• 리터럴이 뭔가요?
  • 사람이 이해할 수 있는 문자나 기호를 사용해 값을 생성하는 표기법

데이터 타입 🔥

• 데이터 타입의 종류는 어떤 것들이 있나요? 🔥
  • 원시 타입(숫자, 문자열, 불리언, undefined, null, 심벌), 객체 타입(객체, 함수, 배열)
• 심벌 타입은 뭐죠?
  • 변경 불가한 원시 타입의 값, 중복되지 않는 유일무이한 값이라 객체의 유일한 프로퍼티 키를 만들기 위해 사용
• 데이터 타입은 왜 필요할까요? 🔥
  • 값의 생성 목적, 용도가 타입에 따라 다름
  • 이에 맞게 메모리 공간의 확보나 해석하는 방법 등이 달라지기 때문에 효율적인 사용을 위해 필요
• 정적 타이핑이 뭔가요?
  • 변수를 선언할 때 할당 가능한 데이터 타입을 사전에 선언하는 방법, 명시적 타입선언
• 동적 타이핑이 뭔가요?
  • 변수는 선언이 아닌 할당에 의해 타입이 결정되며, 재할당에 의해 언제든 타입이 변화할 수 있다는 특징

  1일차 스터디는 사전에 과제를 내주시고 작성해 온 코드를 리뷰하는 식으로 진행되었다. 중간에 헷갈리는 개념이나 잘못 이해하는 개념들을 잡아주시고 새로 설명해주시는 방식으로 스터디가 이뤄졌다. 

시간내서 이 부분은 다시 정리해놔야징 ( •̀ ω •́ )✧

<Label> 태그의 사용

block 요소와 inline 요소

시멘틱 태그

empty elements

  지난 12월 30일부터 제주코딩베이스캠프 은정멘토님이 주관하는 퍼블리싱 스터디를 듣게 됐다.

멋사 FE 스쿨 과정에서 HTML, CSS 비중을 크게 두고 가르쳐주시긴 했지만, 실습으로 적용해 본 경험이 적어서 어떠한 홈페이지를 스스로 제작해낼 수 있을까에 대한 두려움이 컸었다. 다른 스터디들도 있었지만, 지금 내게 가장 필요한 것은 바로 퍼블리싱 능력이라고 생각되어 본 스터디를 지원했고, 합류하게 되었다. 

  비하인드 썰을 풀자면, 우리 멘토님은 간절하고 지금 본인에게 필요한 것이 무엇인지 명확하게 아는 사람이라면 스터디를 빨리 신청했을거라는 생각을 하셨다고 했다. 그래서 스터디 모집인원을 선착순으로 마감했다고 하셨다. 감사하게도 내가 그 마지막 문을 닫고 합류할 수 있었다. 

  선발된 뒤, 멘토님은 한 명 한 명에게 직접 전화를 주셔서 상담도 해주셨다. 그 내용을 간단히 정리하자면 아래와 같다.

• 목표
  • 스스로 짠 코드가 맞는지 틀린지 or 효율적인지를 구분할 수 있도록
  • HTML과 CSS 기초 개념을 다시 잡고 가기
  • 동일한 사이트를 클론하면서 스스로 고민하고 코딩하게 하기
  • 혼공하다보면 우물 안 개구리가 되기 쉬운데, 그러면 안 됨 -> 그렇게 되지 않도록 다양한 코드 참고
  • 기술 스택: HTML + SASS + jQuery(반응형) + JS(모달창 등 인터렉티브 웹 구현 용)
• 과제 할 때,
  • 사이트 하나를 주구장창 고민하며 짜는 것이 좋다.
  • 다른 사람 코드를 보며 좋은 점은 습득하고 배워갈 것

그러면서 퍼블에는 맞고 틀리다는 개념은 없고, 다르다는 개념만 있다고 조언해주셨다. 열린 마음으로 모두의 코드를 봐주시는 분이기 때문에 더 많은 점을 배워갈 수 있을거라는 기대감이 들었다. 멘토님은 다양한 강의경험도 있으시고 17년 동안 이 분야에서 버틴 분이기 때문에 수업에서 배운 이론적인 개념들외에 다른 지식도 많이 얻어갈 수 있을 것 같다.

  기술블로그의 운영이 절실하게 필요하다고 느껴져 다른 채널을 팠다가 다시 돌아왔다..

티스토리에서 글을 쓸 때 소요하던 시간보다 더 많은 시간을 불필요하게 소모하는 것 같았기 때문이다.

조금 더 글쓰는데에 익숙해진 뒤, 옮겨가는 것이 좋다는 판단 하에 다시 이 곳으로 돌아오기로 했다.

빈손으로 오기는 머쓱하니까, 지난 1월 1일에 작성했던 2021년 한 해 회고록을 가져와봤다 (❁´◡`❁)

 

  부끄럽지만, 약 두 달 전까지는 `회고`에 대해 알지 못하던 무지한 상태였다. 여태까지는 그저 살아지는 대로 살아왔던 터라, 혼자서 과거에 이랬지 저랬지 생각하거나 후회하기만 했던 것 같다. 그러던 중 올 해 10월 멋쟁이사자처럼이라는 단체를 만나 교육을 받게 되면서, 다양한 점을 배우기 시작했다.

 

꿈 꾸던 FE개발에 대해서도 배우게 되었고, 학습의 영역을 벗어나 일상의 영역에서도 적용 가능한 다양한 것들을 배우곤 했는데 그 중 하나가 바로 `회고`이다. 단순히 과거에는 후회하고 지나갔다면, 이제는 기준을 가지고 스스로를 되돌아볼 수 있게 된 것 같다. 그런 의미에서 한 해의 마지막인 오늘, 2021년을 회고해보는 시간을 가져보려고 한다.

 

느낀점

  시각화 영역은 초기 커리큘럼에는 포함되지 않았던 부분인데, 중간에 강사님이 필요성을 느껴서 추가하신 내용이다. 사실 이론 위주로 많이 학습이 진행되서 약간 내가 올바르게 공부하고 있는 것이 맞는지에 대한 고민을 조금 했는데, 오늘 간단하지만, 실무에서 흔히 활용되는 시각화 도구들을 가지고 활용하는 코드를 직접 짜면서 다시 한 번 막연하게 가지고 있었던 두려움을 해소할 수 있었다. 사실 직접 해보면 충분히 할 수 있고 어렵지 않은 부분인데, 주저하다가 그 기회를 놓치거나 내 마음 속 거대한 거인으로 스스로 만들어버려 지레 겁먹는 현상을 자주 겪게 되는 것 같다. 차라리 걱정할 거면 생각을 하지 말자...🤦‍♀️ 그리고 내가 나를 아는 것처럼, 한 번 하면 제대로 하는 사람이라는 것을 증명하자! 이해도, 습득도 빠른 내 장점을 살려 쉬는 시간을 줄이고 더 적극적으로 학습해나가야겠다!

  1분코딩 유준모대표님 특강!!! 열정으로 똘똘뭉친 강의로 three.js 특강 1시간 연장해서 가르쳐주셨다. 감동 그자체😭  

그리고 어제 자러가기 전까지 과제가 잘 안된다며 걱정하던 팀원 언니가 걱정이 되는 마음에 2시까지 같이 시간을 보내다 먼저 돌아갔는데, 새벽까지 열정적으로 공부하던 언니가 의지와 끈기로 해내서 은님 공인 우수 과제자로 선정되었다!! 정말 대단하고 멋지다고 느끼기도 했고, 나도 언니처럼 끝까지 코드를 붙잡고 버텨야겠다는 생각을 했다! 안배운 부분이라고 포기하지 말고, 누군가 다 가르쳐주겠다는 생각도 하지말고, 공식문서 찾아보고 구글링도 많이 해보고 해내겠다는 다짐으로 공부하는 것이 필요할 것 같다!! 잠이 대수냐.. 지금 전설적인 개발자 은님이 과제를 내주시고 봐주시는데!!!!! 오늘부터는 수면시간 대폭 하향한다 레츠고,,,,, 컴포트존 딱 대.. 나 완전 성장하고 만다. 진짜 내년 초 안에 무조건 취업하고 만다. 아캔두 유캔두 위캔두! ( •̀ ω •́ )✧

  특강이 끝나고 우리 그룹 채팅방에 놀러와주신 대표님,, 담에 커피챗도 해주시기로 하셨다! 너무 신나고 기대된다🥰

  그리고 종종 우리 그룹 채팅방에 놀러와주시겠다고 한 멋쟁이 대표님 💖🧡💛💚💙💜

오늘 한 것

• 시각화(canvas, chartjs, D3)
• github 심화
• three.js

내일 할 것

• 멋사 FE 스쿨 수업
• 리액트 스터디