공대키메라

내가 정리하는 react내용은 전부 zerocho teacher의 강의로부터 가져온 것이다. 무료 강의 감사합니다. ㅠㅠ 우리모두 inflearn의 zerocho react강의로 공부해용!~ 강의명 : 웹 게임을 만들며 배우는 React - zerocho 5-1 가위바위보 react를 접하면서 가장 어려웠던 부분이 세팅하는 부분이었고 그다음이 아마 어떤 방식으로 코드를 짜야 하는지인것 같다. 어떤 언어를 접하더라도 처음 접하게 되면 그것은 누구나 다 똑같으리라 이번 가위바위보를 구현하면서 처음본 부분이 이제 componentDidMount, componentDidUpdate, componentWillUnmount, useEffect 등이 있다. 이러한 부분을 실제로 실무에서 어떻게 쓰는지 코드를 알 길이..

모델링 모델링 1. 일반적인 시스템 개발 절차 일반적으로 시스템 개발은 데이터 관점과 프로세스 관점의 두 가지로 진행되는데, 개념 모델링을 통해 개발 범위를 파악하고, 업무 중심의 분석(논리 데이터 모델링, 분석 모델링) 단계를 거쳐 개발하고자 하는 환경을 고려한 설계(물리 데이터 모델링, 설게 모델링) 단게로 구체화되어 개발(데이터베이스 구축, 애플리케이션 개발)단계로 진행된다. 2. 모델링의 정의 복잡한 현실세계의 현상을 특정한 목적에 맞추어 일정한 형식으로 이해하기 쉽게 표현하는 일을 의미한다. 3. 모델링의 특징 추상화는 현실 세계를 일정한 형식에 맞추어 표현을 한다는 의미로 정리할 수 있다. 즉, 다양한 현상을 일정한 양식인 표기법에 의해 표현한다는 것이다. 단순화는 복잡한 현실세계를 약속된 규..

https://developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/Introduction DOM 소개 - Web API | MDN 이 문서는 DOM에 대한 개념을 간략하게 소개하는 문서이다: DOM 이 무엇이며, 그것이 어떻게 HTML, XML (en-US) 문서들을 위한 구조를 제공하는지, 어떻게 DOM 에 접근하는지, API 가 어떻게 사용되는지에 developer.mozilla.org MDN사이트는 사기다 모든 정보가 다있다 ! ㅠㅠ 외쳐 MDN 만세! 하여간... REACT를 공부하는 와중에 DOM이 나왔는데 DOM을 많이 접하지만 정확히 설명하라고 하면 못할거 같아서 이렇게 공부를 한다. DOM이란 그래서 뭐냐? 문서 객체 모델(The Do..

거룩한 일요일 필자는 Callback과 Promise에 대해 공부를 했다. https://tech-monster.tistory.com/43 Callback Fucntion 이란? 의미를 파악해 보자. ???? call me back~ 뭔가 전화를 다시 걸라는 건가...? (내 번호 안알랴줌) 그 느낌 그대로 callback을 다시 본다면 단어 뜻 자체가 회신하다/답신하다 라는 뜻을 지닌다. 그러면 callba tech-monster.tistory.com 간단하게 callback에 대해서 알고싶으면 callback Function이란? 이라는 블로그를 참고해주세요 나는 우선 강의를 듣고 그다음에 docs 를 찾아보려고 하는데 좋은 내용을 단시간에 함축해서 전달해 주면 시간 효율이 배가 되기 때문이다 물론 ..

여러분~ let 대신에 Var를 써야고 한답니다. 사실 이번에 회사에 입사하면서 프론트에서 jQuery를 이용할 일이 많아졌다. 문제는 아직도 회사에서 Var를 이용해서 변수를 선언하는 것이다. Let은 ECMAScript 6에서 새로 도입된 것으로 var와 같이 변수를 선언할 수 있다. 그러면 둘의 차이는 뭘까?? 우선 내가 참고해서 공부한 영상 링크를 달아놓겠다. https://www.youtube.com/watch?v=OCCpGh4ujb8&ab_channel=%EB%93%9C%EB%A6%BC%EC%BD%94%EB%94%A9by%EC%97%98%EB%A6%AC 그렇다 나는 그녀의 노예다... 여기 나오는 내용으로 코드를 정리해서 보여주겠다. console.log(age); age = 4; consol..

모든 내용은 Youtube의 ellie teacher가 한 것을 기반으로 한다. https://www.youtube.com/watch?v=tJieVCgGzhs&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=2&ab_channel=%EB%93%9C%EB%A6%BC%EC%BD%94%EB%94%A9by%EC%97%98%EB%A6%AC 영상을 보길 원하면 위에 들어가면 된다. 그렇다... 나는 그녀의 충실한 노예다... 하여간 여기서 script를 불러오는 방식에서 Async와 Defer가 있다. 우선 가장 기본적으로 사용하는 html 형식을 보자 . 브라우저에서 위에서 부터 천천히 html을 읽어들이기 시작한다. 순차적으로 쭉 내려오다가 script를 만난다. 어! test..

Prototype 이란 뭘까? 우선 영어 사전을 검색해 보자 . 검색해 본 결과 원형이라는 말이다. 어떤 원형인지 그것을 이제부터 같이 알아갈 것이다. 생성자 함수가 있을 때 new 연산자로 인스턴스를 만들게 되면 그 인스턴스에는 constructor의 prototype이라고 하는 프로퍼티의 내용이 Prototype이라고 하는 프로퍼티로 참조를 전달하게 된다. 이게 무슨말이냐면 Constructor.prototype이랑 instance[[Prototype]]가 곧 같은 객체를 바라본다는 말이다. 그런데... [[Prototype]]는 접근가능한 것이 아니라 정보를 보여주기만 할 뿐으로, 실제 동작상으로는 instance와 동일시가 된다. 그래서 밑의 그림처럼 삼각형이 된다. 그래서 이게 어쨋다는 건지는 ..

close ? closure? closure를 검색하면 "폐쇄"라는 뜻이 나온다. 뭐를 폐쇄하는지? Closure를 더 검색해보자. MDN 사이트를 확인하자 눈여겨 봐야 할 부분이 "함수와 함수가 선언된 어휘적 환경의 조합이다" 라는 부분이다 다시 정리하면 "에워싸여져 함께 묶여진 함수"라고 할 수 있다. => 둘러쌓인 LexicalEnvironment의 참조 라고 볼 수 있다. 다시 다른말로 보자면 위 그림들을 보자면 뭐... 글 그대로 읽고 그림을 본다면 이해가 갈 것이다. 그러면 특별한 현상이 뭔지 이제 알아가보자. 우선 전에 해봣던 것을 복습해보자. var outer = function(){ var a = 1; var inner = function(){ console.log(++a); }; inn..

의미를 파악해 보자. ???? call me back~ 뭔가 전화를 다시 걸라는 건가...? (내 번호 안알랴줌) 그 느낌 그대로 callback을 다시 본다면 단어 뜻 자체가 회신하다/답신하다 라는 뜻을 지닌다. 그러면 callback function 은 회신하는 함수가 된다. 함수를 하나 처리하고 나서 회신을 준다는 것이다! 이말은 즉 콜백함수에 대한 제어권을 내가 넘기고자 하는 대상한테 위임하는 것이다. 이 콜백을 어떻게 처리할지는 제어권을 넘겨받은 대상이 전적으로 관여를 한다. 넘겨줄 제어권에는 다음과 같은 항목이 있다. 실행 시점 매개 변수 this 1. 실행 시점 setInterval(function(){ console.log('1초마다 실행될 겁니다.'); }, 1000); setTimeou..

전에 Context에 대해 공부해보았다. 다시 보고 싶다면 링크를 달아두겟다옹 히힛 https://tech-monster.tistory.com/41 Context 란? 내가 공부하고자 하는 전반적인 내용이 아래 블로그에 담겨있다. https://poiemaweb.com/js-execution-context Execution Context | PoiemaWeb Execution Context(실행 컨텍스트)는 scope, hoisting, this, functi.. tech-monster.tistory.com 여기 inner안에 보면 ThisBinding이라는 아이가 있다. 이건 뭥미? 우선 제대로 알기 전에 이 문장을 기억하란다 thisBinding은 실행 컨텐스트가 활성화될 때 한다! 실행 컨텍스트가 ..