front-end/JavaScript, TypeScript4

• 

  [TS]타입스크립트 react props intrinsic attributes 오류 React에서 나는 이 오류가 리스트를 자식 component에게 주입하려고 할 때 발생했다. 내가 구성한 component 부모 - 자식 구조는 다음과 같다. 부모 - memoList -> contens -> contenItem - 자식 다음은 내가 최상위 component memoList에서 자식 컴포넌트로 내려보내려고 한 리스트이다. 여기는 memoList의 자식 컴포넌트 contents에서 contentList를 구조 분해 할당 문법을 사용하여 받으려고 하니 발생한 react props intrinsic attributes 오류이다. 리액트에서 props는 한 객체로 내려가게 되는데 이 props객체를 구조분해하여 할당하려고하니 다음과 같은 오류가 났다. 그래서 다음과 같이 타입을 정의해주니 오류.. front-end/JavaScript, TypeScript 2022. 3. 26.

• JAVASCRIPT에 대한 고찰-함수편 javascript는 상당히 매력적인 언어이다. 브라우저 상에서 동작하는 언어이기 때문에 다양한 이벤트 함수들이 존재하고 다른 언어들과는 달리 비동기 처리에 특화되어 있는 면이 있다. 리액트로 개발을 하면서 나는 자바스크립트와 타입스크립트를 많이 사용했다. 하지만 항상 사용하던대로 사용했지 이 언어가 어떻게 브라우저 상에서 돌아가는 지 메모리 구조는 어떤 방식으로 할당이 되는지가 궁금해졌다. 사실 리액트로 프론트 엔드 개발을 하면 더 빠른 렌더링에 대한 고찰이 필요하다. 요즘 핫한 next sj 리액트 프레임워크또한 serverside rendering 과 staticside rendering 방식을 사용하여 더 빠른 렌더링 더 빠른 반응성에 대한 고민을 보여주고 있다. 기본을 알아야 심화를 더 잘 이해.. front-end/JavaScript, TypeScript 2022. 3. 19.

• 정규표현식(REGEX) 정규표현식이란? 정규표현식이란 특정한 규칙을 가진 문자열을 표현해내는 방식을 의미한다. 위와 같이 설명하면 어려울 수 있지만 우리가 흔히 이메일 주소나 url 주소와 같은 형식을 보면 일정한 형식을 가지고 문자열을 배치하지 않는가 그와 같은 형식을 검색하거나 받아들일 수 있는 표현식을 말한다. 우리가 흔히 웹이나 앱서비스를 개발할 때 회원가입과 같은 기능에서 어떠한 형식을 통해 비밀번호나 아이디를 만들라고 하지 않는가 그 때 많이 쓰는 표현식이다. 아래는 유튜브 주소를 검색하거나 받아들일 수 있는 식이다. /(?:https?:\/\/)?(?:www\.)?(?:(?:youtu\.?be\/?)(?:\.com\/)?(?:watch\?v\=)?(?:embed)?)([a-zA-Z0-9]{11})/ 유튜브 주소는 .. front-end/JavaScript, TypeScript 2021. 8. 11.

• 

  타입스크립트로 stack 구현하기 { //Linked list 기반 stack interface stack{ readonly size : number; push(value : string) : void; pop() : string; } type node = { nextNode? : node; prevNode? : node; str : string; } class Stack implements stack { private Head? : node; private Tail? : node; private size1 : number = 0; // getter와 이름이 겹치면 안됨 get size() { return this.size1; } push(str : string) { const temp : node = {str}; if(this.size.. front-end/JavaScript, TypeScript 2021. 7. 28.