본문 바로가기

분류 전체보기

 (200)
TypeScript의 .d.ts 파일 🧐 안녕하세요 웹 35기 YB 최민입니다 오늘은 TypeScript의 .d.ts 파일은 무엇이고 왜 작성하는지에 대해 글을 작성해보려고 합니다 !그 이유는..  week4과제 중 .d.ts파일을 작성하는데 무엇인가 계속 연결이 안되서 따로 파일을 만들지않고 theme.ts파일안에 함께 작성하였는데 그래도 더 알아보고 싶어서 선정하게 되었습니다 😢  ✅.d.ts 파일이란type을 정의(declare)하기 위해서 존재하는 파일 TypeScript에서 .d.ts 파일은 타입 선언 파일로, 타입 정보를 제공해서 타입 안정성과 코드 보안을 강화하는 역할을 한다고 합니다 ! ✅그렇다면 왜 따로 파일을 만들어서 사용하나요 1. 타입과 구현의 분리.d.ts 파일은 타입 선언만을 포함하고 코드의 구체적인 구현 내용은 포함..
타입스크립트의 타입 안녕하세요, 웹 YB 한수정입니다. 타입스크립트 이름에도 타입이 있듯이, 타입스크립트에서는 변수에도 타입이 지정된다는 점이 가장 큰 특징이 아닐까.. 생각이 들고 자바스크립트와 가장 큰 차이점도 타입 지정이라는 생각에 타입에 대해 혼자 정리하듯 간단 정리를 해보았습니다.. 너무 어렵네요ㅜㅠ 하지만 피할 수가 없어 즐기겠습니다. 타입스크립트가 처음이라 아주 간단한, 제가 이해한 것만 정리한 점 양해 부탁드립니다. 그럼 시작   타입스크립트에서는 기본적으로 타입 추론이 가능하여, 변수를 선언할 때 타입을 명시하지 않아도 타입스크립트가 자동으로 타입을 추론해 줍니다. 예를 들어, 변수 size에 숫자 값을 할당하면, 타입스크립트는 자동으로 size의 타입을 number로 추론합니다. 이때, size 변수에 커..
[4주차] Typescript 왜 사용할까? 제대로 알고 사용하자 지금 당장 구직사이트에서 프론트엔드 개발자만 검색해봐도 많은 IT기업들은 Typescript 사용 경험자를 우대하거나 필수로 하고 있는 것을 볼 수 있다. 또한, Typescript의 중요성과 인기가 나날이 증가하고 있다. 그렇다면 왜? Javascript가 아닌 Typescript를 사용할까? 단순히 타입 체크를 위해서 일까? 지금 같이 알아보러 가자.=> Typescript의 그래프가 가장 가파른 상승세를 보여주고 있다.Typescript가 Javascript를 대체하고 있는 이유를 알기 전에 Typescript와 Javascript의 차이점을 알아보자📌동적 타입(Javascript) vs 정적 타입(Typescript) - 동적 타입: 변수의 타입이 런타임 시점에 결정된다. 즉, 변수에 어떤 값이..
[week3]- 이벤트처리 안녕하세요! YB 이윤지 입니다.ㅎㅎ이번 주차는 이벤트처리와 useState에 대해서 공부해봤는데요! 그 중에서도 이벤트 처리에 대해서 정리해봤습니다 😊레쓰고~~ *모든 내용은 React 공식문서를 기반으로 작성되었습니다. 1. 이벤트 핸들러이벤트 핸들러는 클릭, 마우스 호버, 폼 인풋 포커스 등 사용자의 상호작용에 따라 유발되는 사용자 정의 함수이다.다음과 같이 함수를 정의하고 3단계를 거칩니다.1. Button 컴포넌트 내부에 handleClick 함수 선언하기2. 해당 함수 내부 로직 구현하기 -> 여기서는 이벤트 메세지를 표시하기 위해 alert 사용3. JSX에 onclick={handleClick} 추가. 여기서! 바로 handleClick 이 이벤트 핸들러 주로 컴포넌트 내부에서 정의되며..
[week3] - 이벤트에 응답하기, State: 컴포넌트의 기억 저장소, 랜더링 그리고 커밋, 스냅샷으로서의 state 안녕하세요 웹파트 YB 한수정입니다!벌써 3주차가 밝았습니다. 이번 주는 이벤트에 응답하기, State: 컴포넌트의 기억 저장소, 랜더링 그리고 커밋, 스냅샷으로서의 state에 대해 공부하고 정리해보는 주입니다! 공식 문서를 보며 공부해보니, State는 React에서 매우 중요한 개념으로, 모든 컴포넌트의 동작과 데이터 관리에 깊이 연관되어 있음을 느꼈습니다. 그래서 타이틀에 state가 들어가 있는 State: 컴포넌트의 기억 저장소와 스냅샷으로서의 state에 대한 개념을 한 번 더 정리하려고 합니다! State: 컴포넌트의 기억 저장소State는 React에서 컴포넌트가 "기억"해야 하는 데이터를 의미합니다. 사용자의 상호작용에 따라 화면 내용을 변경하기 위해 필요한 정보들, 예를 들어 현재 입..
[week3] 이벤트 핸들러 및 전파, State 안녕하세요! 물결웹팟 OB 박채연입니다 😋 이번주차엔 이벤트 및 State에 관련된 내용을 공부했는데요,간단한 상태를 다루는 주차라 공식문서의 모든 내용보단 제가 잘 모르고 넘어갔던 내용들을 깊게 파보고자 해봤습니다! 우리가 프로젝트 만들 때 수많은 상태를 만들고 사용하는데,막상 state에 대해 깊게 찾아보고 공부한 적은 없는 것 같더라구요 -!그래서 이번주, 다음주 동안 state에 대해 자세히 알아보면서 리액트에 더더욱 딥다이브 해보면 좋을 것 같습니다 💨     📍 이벤트 핸들러클릭, 마우스 호버, 폼 인풋 포커스 등 사용자 사용작용에 따라 유발되는 사용자 정의 함수 이벤트 핸들러로 전달한 함수들은 호출이 아닌 전달이 되어야 한다.함수를 전달하면 사용자가 버튼을 클릭했을 때만 함수를 호출하지..
[3주차 React 상태관리 ✍🏻] Recoil, Jotai 안녕하세요! 웹파트 OB 박채연입니다 😋이번주차엔 리액트의 상태관리 라이브러리에 대해 자세히 다루기로 해서, Recoil, Jotai에 대해 한번 공부해봤습니다 😊그리고 공부하다보니, 전역상태관리를 하면 복잡한 prop 관리에도 좋고.. 코드도 깔끔해지는 기분이라, 상태관리 라이브러리를 쓰는 게 무조건 좋은건가? 라는 생각이 들어서 관련 내용을 찾아보니, 역시나! 무조건적으로 좋은 건 없더군요 ..이 부분에 대해서도 짧게 작성해뒀으니 한번 읽어봐주시면 감사하겠습니다 🙇🏻‍♀️  티스토리 로그아웃 문제 해결되길 바라며 ..아티클 노션링크 두고 갑니다 !-! https://chaeneey.notion.site/Recoil-Jotai-13ade3f57d0e80948ff7f8e4e30d4a50?pvs=4..
[week3]상호작용성 더하기 - 이벤트에 응답하기, State: 컴포넌트의 기억 저장소, 랜더링 그리고 커밋, 스냅샷으로서의 state 더보기안녕하세요! 웹파트 OB 김건휘입니다. 이번 시간에는 리액트 공식문서 - 상호작용성 더하기 - (이벤트에 응답하기, State: 컴포넌트의 기억 저장소, 랜더링 그리고 커밋, 스냅샷으로서의 state)내용 중에서 궁금한 부분 딥다이브 및 요약에 대한 아티클을 작성해보겠습니다. 이벤트에 응답하기"이벤트에 응답하기"의 내용 중 e.preventDefault()에 대한 설명을 위해, 태그의 기본 동작에 대한 설명이 있었다. 사실 이전에도 , 과 같은 대표적인 HTML 요소들의 기본동작은 어느정도 알고 있었는데, 다양한 HTML 요소들의 기본동작에 대해서 알아보고 싶어서 공부하게 되었다. 📌HTML 요소들의 기본동작  (링크 태그):href 속성에 지정된 URL로 이동하는 것이 기본 동작이다. 클릭 시 ..

티스토리툴바