new Korea()

🅿️ Props Props의 개념을 배울 때 당시 정리해둔 내용은 "컴포넌트 확장 방식이며, 부모 컴포넌트에서 자식 컴포넌트로 데이터를 보내는 방법" 으로 한 줄 정리해두었다. 이를 Java와 엮어서 생각했을 때, 가장 먼저 떠오른 개념은 메소드 파라미터이다. 사실, Java 뿐만 아니라 대부분의 프로그래밍에서는 파라미터라는 개념을 사용할 것이다. 이를 리액트에서는 왜 따로 Props로 정리한지는 모른다. 다만, 자바의 메소드 파라미터와 가장 큰 차이점이 있다면 "함수 자체를 전달받을 수 있다"는 내용일 것이다. 자바의 경우, 메소드 파라미터에 들어갈 수 있는 정보들이 int, String, array와 같은 데이터 형태거나, 클래스의 형태를 전달받아 사용하게 된다. 데이터 형태의 경우 직접 사용하는 ..

📢 State.. useState! Java를 다루다가 JavaScript의 함수들을 접하면 가끔씩 깜짝 놀란다. 특히, React와 같은 프론트엔드쪽에 대한 공부를 하다보면 정말 새로운 세상을 접하는 것 같은 느낌이 든다. 오늘 간단히 포스팅할 useState 함수도 그 중 하나다. 난 State는 보다 편한 이벤트 리스너를 위한 React 내 지원 함수라고 정리했다. 인터넷을 뒤져보면 더 정확한 정의나 기능에 대한 설명은 있을 것이다. 다만, 나는 나의 언어로 개념을 정리할 뿐이다. 물론.. 아주 많이 엇나갔다면 누군가 지적해주시길 바랄 뿐이다. 말이 잠깐 다른 곳으로 샜다. 보다 편한 이벤트 리스너를 위한 함수라는 것은 어떤 값에 대한 상태를 주시하다가 해당 값에 대한 변화가 발생하면 어떠한 동작..

최근 노마드코더의 React 무료 강의를 통해 React에 대해서 조금 공부해보고 있다.이따금씩 올라올 React 관련 내용은 노마드코더의 무료 강의에서 배운 내용을 기준으로 일부 지식을 검색하여 포스팅할 예정이다. 📖 JSX란?간단히 말하면 JavaScript의 확장 문법이다.JavaScript 내에서 HTML 태그 생성 코드를 그대로 사용할 수 있는 기능을 제공한다. JavaScript 카테고리로 생성하지 않은 이유는 해당 문법을 통해 UI를 정의하려면 React와 함께 사용되어야 하기 때문이다. 또한, JS엔진에서 JSX 문법을 정확히 해석하기 위해서 Babel을 통한 구문 변환이 필요하다.즉, JSX를 이용하기 위해서는 아래 2가지가 선행되어야 한다.JSX를 지원하는 프레임워크 사용(최초엔 R..

📝 Hoisting 호이스팅은 감아올리다, 게양한다 라는 의미를 갖고 있다. 그리고 자바스크립트의 호이스팅은 변수가 선언된 시점을 위로 감아올려 버린다는 것이다. console.log(age); age = 4; var age; 해당 코드는 에러가 날 것 같은가? 정상적으로 본다면 에러가 맞다. 그러나 자바스크립트는 이를 에러로 잡지 않는다. var라는 변수는 ES6가 등장하기 전 변수를 선언하던 타입이다. 그리고 이 var는 hoisting이 적용된 예시의 대명사다. 위의 코드에서 age 선언에 대한 코드는 가장 아래있다. 하지만 이를 가장 위로 끌어올려서 console.log(age)에는 선언은 됐지만 값이 들어있지 않을 때 출력되는 undefined를 출력하게 되고, age = 4라는 코드는 그대로 ..

👀 내가 들은 강의 최근 실시간 문서 협업 툴 프로젝트를 구현해보려고 한 적이 있었다. 여러 기술들을 처음 접해볼 수 있었는데, Websocket 이나 WebRTC, CRDT 알고리즘 등이다. 그중 유튜버 노마드코더의 무료 강의 중 Websocket과 WebRTC를 클론코딩 해볼 수 있는 커리큘럼이 있어서 들어보는 중이다. 🙄 처음 접한 Node.js 아쉽게도 내가 주로 사용하는 언어인 Java나 Python이 아닌 JS로 내용이 이루어져 있었다. 특히, JS로 백엔드를 구현할 수 있는 Node.js를 이용했는데, 프론트엔드와의 연계 성능이 좋아서 실시간 기능을 구현하는데 큰 장점이 있다고 한다. node.js의 자세한 특징은 https://hanamon.kr/nodejs-%EA%B0%9C%EB%85%9..