본문 바로가기

분류 전체보기

(200)
타입스크립트에서 type과 interface의 차이점에 대해 알아보자 typescript의 type과 interfaces는 비슷한 역할을 하지만 몇 가지 중요한 차이점이 있습니다. 이 글에서는 type과 interface의 특징과 차이점을 비교하여 언제 어떤 것을 사용하면 좋을지 살펴보겠습니다!1. 기본 정의와 사용typetype은 typescript의 타입 별칭을 정의하는 키워드입니다. 기본적으로 어떤 타입이든 별칭을 붙여 사용할 수 있습니다.type Point = { x: number; y: number;};interfaceinterface는 객체 타입을 정의할 때 주로 사용됩니다. 클래스와의 호환성 덕분에 객체 지향 스타일의 코드에서 유용합니다.interface Point { x: number; y: number;}2. 주요 차이점확장 방식type: 유니온 타..
[Week 8] Jest, React Testing Library TDD(Test Driven Development: 테스트 주도 개발)TDD는 개발자가 새로운 기능이나 함수에 대한 테스트 케이스를 먼저 작성하고, 그 테스트를 통과하기 위한 최소한의 코드를 작성하는 개발 기법이다. 이 방법론은 코드의 기능에 초점을 맞추며, 개발자의 관점에서 테스트 케이스를 작성한다.실패하는 테스트 작성: 구현할 기능에 대한 테스트 케이스를 작성하여 초기 상태에서 테스트가 실패하도록 만든다.테스트를 통과하도록 수정: 작성한 테스트를 통과시키기 위해 필요한 최소한의 코드를 구현한다.리팩토링: 통과한 테스트를 기반으로 코드의 품질을 개선하고 가독성을 높인다.BDD(Behavior Driven Development: 행동 주도 개발)BDD는 TDD에서 파생된 개발 방법론으로, 테스트 케이스 ..
[week 8] Web Vitals & Lighthouse https://toothsome-coaster-0a4.notion.site/week-8-Web-Vitals-Lighthouse-15d28dd31db08095b001d45b6e191049?pvs=4 [week 8] Web Vitals & Lighthouse | Notion🖥️ Web Vitalstoothsome-coaster-0a4.notion.site  안녕하세요! 웹 YB 김가현입니다 ~Web Vitals & Lighthouse에 대해 정리한 노션 글 첨부합니다 !이따봐욧
타입스크립트 - interface 안녕하세요, 역시나 못 썼던 4주차 아티클로 찾아온 웹 YB 김태욱입니다 이번 합동 세미나에서 처음으로 타입스크립트로 프로젝트를 진행했는데 가장 많이 마주했던 오류는 any타입 오류였습니다. 그만큼 타입스크립트에서 가장 기초가 되는 부분이 바로 타입 지정인데요, 이번 주차에서는 타입스크립트 interface에 대해서 작성해보도록 하겠습니다. - interface란?인터페이스 (Interface)는 타입 체크를 위해 사용된다. 인터페이스는 변수, 함수, 클래스에 사용할 수 있으며, 인터페이스에 선언된 프로퍼티 또는 메서드의 구현을 강제해 일관성을 유지하도록 한다. - interface 선언interface User { age: number; name: string;}//변수에 활용한 인터페이스const..
[ Week 07 ] ♻️ 데이터 페칭 SSR 안녕하세요 ! 웹파트 YB 김민정입니다.이번에 데이터페칭 SSR 을 맡았는데요 SSR 을 검색하면 죄다 Next.js 에 대한 이야기 뿐이더라구요.사실 Next.js 는 SSR 를 비롯한 4가지 렌더링 기법을 사용한다는 것을 알고 계셨나요?!!그래서 SSR = Next.js 가 되는 것에 살짝 의구심이 생겨서Next.js 를 제외하고 설명해보고 싶었습니다,,그래도 뺄 순 없었어요..... 열심히 정리했으니 참고해주시구 화요일에 보아요🥺🥺  https://vi-olet.notion.site/SSR-15c5981b4f4580789dece81f199a64e5?pvs=4
TanStack Query 집중공격 안녕하세요 웹 OB 임화랑입니다.이번 4주차 공유과제로는 앱잼에서 뿐만 아니라 앞으로의 다양한 프로젝트에서 거의 필수적으로 사용되는 react query로 알려져있는 TanStack Query에 대해 집중적으로 공부해보았습니다. 저도 지난 앱잼에서 대충 사용법만 아는 상태로 코드만 작성해봤지 어떤 원리로 동작하고, 다양한 옵션들에는 무엇이 있는지 등등 이해하고 사용하지 못하고 있다는것에 큰 아쉬움이 있었습니다. 그래서 이번 앱잼에서는 이를 이해하고 좀 더 다양한 방법으로 사용해보기 위해 미리 TanStack Query에 대해 공부해 보았습니다. https://wary-splash-64f.notion.site/TanStack-Query-154f4acbc8328030b228e8726a0a86dd
[week 06] 이벤트의 모든 것 🎪 안녕하세요! 물결웹팟 🌊 오비 박채연입니다 😋❕  이번주 자스핑 주제는 이벤트 전파 및 제어, 디바운스와 스로틀에 대해서 공부하는 시간을 가져봤는데요!그냥 버튼에 클릭 이벤트 주고 .. 인풋에 체인지 이벤트 주고! 늘 습관처럼 해왔던 건데이걸 깊게 파보니까 또 캡처링 버블링 .. 전파.. 위임.. 등 정말 복잡한 내용이 많았읍니다 ,,이번주도 모두모두 파이팅 💪🏻  https://chaeneey.notion.site/597f4dbb63064076b2be8d70c560e6e0?pvs=4  디바운스과 스로틀 | Notion디바운스와 스로틀chaeneey.notion.site https://chaeneey.notion.site/159de3f57d0e801580e0da34bcd7d54c?pvs=4  이벤..
[Week 06] 이벤트 전파 및 이벤트 제어 & 디바운스와 스로틀 이번시간에는 이벤트 & 디바운스와 스로틀에 대해 알아보았습니다! 때마침 지난번에 작성한 이벤트 전파, 이벤트 위임과 관련된 내용도 참고해보시면 좋을 것 같습니당ㅎㅎhttps://wave-web.tistory.com/41 [JavaScript] 이벤트위임안녕하세요 웹파트 배영경입니다🤗이번에는 자바스크립트의 이벤트위임에 대해 알아보았습니다! 2주차 과제를 구현할 때 각 체크박스마다 이벤트 리스너를 개별적으로 등록하는 방식을 사용wave-web.tistory.com https://harsh-lunge-188.notion.site/1582ba38c2418036855dcbd0a4be8c72?pvs=4 이벤트 전파 및 이벤트 제어 & 디바운스와 스로틀 | Notion40장 이벤트harsh-lunge-188.not..