본문 바로가기

분류 전체보기141

[TIL] 2025-4-23 타입스크립트 오늘은 타입스크립트에 대해서 배워보았습니다!지금까지 배웠던 내용들은 진짜 조금이라도 찍먹 해본 내용들이였는데 타입스크립트는 정말 처음 해보는거라서 재밌게 들었습니다 타입스크립트를 간단하게 설명해보자면 자바스크립트 + 정적타입검사 + 객체지향프로그래밍입니다.즉, 타입스크립트가 자바스크립트의 상위 호환이기 때문에 타입스크립트에서 자바스크립트 문법을 사용해도 문제없이 작동합니다 다만 타입스크립트의 장점중 하나가 타입을 명시하여 오류를 방지하는것인데 타입스크립트에서 타입을 명시 하지않는 자바스크립트 문법을 쓸필요가 있을까 싶네요 타입 스크립트를 사용하는 이유이유설명정적 타입 검사실행 전에 타입 오류를 잡을 수 있어서 안정성 ↑IDE 지원 강화코드 자동완성, 인텔리센스, 리팩토링 기능이 좋아짐가독성과 유지보수 향.. 2025. 4. 23.
[TIL] 2025-4-22 커스텀 Hook 오늘 강의에서는 커스텀 hook과 api를 활용하여 뉴스뷰어를 만들어 보았습니다.커스텀 훅에대해 더 알고 싶어서 커스텀 훅에 대해 정리해보고 api호출을 통해 값을 받아올 수 있는 커스텀 훅을 작성해보았습니다. 커스텀훅이란?React의 기본 훅을 조합해서 만든 재사용 가능한 함수 사용시 주의사항항목설명이름은 use로 시작React 규칙 (예: useModal, useScroll)훅 안에서 다른 훅 사용 가능useState, useEffect 등로직만 작성JSX 반환 x, 상태나 함수만 반환O컴포넌트처럼 조건문 안에서 호출 x항상 최상위에서 호출해야 함import { useState, useEffect } from 'react';function useFetch(url, options) { const [d.. 2025. 4. 22.
영어 회화 스터디 - 미신과 믿음 https://casenglish.com/books/freetalking?lesson=290 캐스영어 :: 북미 원어민과 즐거운 화상영어·전화영어북미 강사와 함께하는 북미 원어민 전화영어/화상영어! 거품 없는 깜짝 놀랄 가격, 정확한 발음. 미국인, 캐나다인 선생님과 함께하는 1:1 미국전화영어/캐나다전화영어casenglish.com오늘의 질문1. Do you believe in superstitions? Why or why not?한국어 답변: 저는 미신을 그닥 믿지 않습니다. 저는 논리나 과학에 더 의존하는 편입니다. 영어 답변: I don’t really believe in superstitions. I try to rely more on logic and science.2. What are som.. 2025. 4. 22.
[TIL] 2025-4-21 Router Hook 오늘은 router를 사용하여 SPA를 만들어 보았는데요수업시간에 배운거 이외에도 알면 좋은 hook 있을것 같아서 찾아서 같이 정리해 보았습니다 Router Hook이름설명주요 용도/ 예시useLocation현재 URL의 정보(location 객체)를 반환현재 경로, 쿼리스트링, 상태 값 확인useParamsURL 파라미터 값 추출 (/users/:id 같은 동적 라우팅에서 사용)const { id } = useParams();useSearchParams쿼리스트링을 읽고 조작할 수 있음?page=2&sort=asc 같은 검색 파라미터 처리useNavigate프로그래밍 방식으로 페이지 이동 (Link 없이 이동 가능)로그인 후 자동 이동, 조건부 이동useOutlet중첩 라우팅 시, 현재 라우트의 자식 .. 2025. 4. 21.
[TIL] 2025-4-18 Hook 아.. 오늘은 멘붕의 도가니탕이였습니다오전에 노트북 화면이 한번 이상하게 나오는것을 보고 뭔가 불안하지만 괜찮겠지..? 싶었습니다근데 문제는 노트북이 아니였습니다..티비 겸용으로 쓰고 있는 스마트 모니터가 멈춰버린 것입니다...하.... 돈없는데눈물이 날것만 같았습니다근데 오후가 되니 결국 노트북도 죽어버렸습니다이정도면 나도 같이 데려가지 왜 너네들끼리 가버리는데..?나 소외감 들어...아프지마 도토 도토 잠보다행이 러키비키하게 스마트 모니터는 방금 고쳤습니다하지만 쉬는시간에 고객센터 전화하고 모니터 만지작 하느라 수업을 많이 못들어서오늘은 심플딤플하게 배웠던 내용들 정리를 해야겠습니다(멘탈나가서 머릿속에 남은게 없어요)Hook리액트의 Hook은 함수형 컴포넌트에서 상태나 라이프사이클과 같은 기능을 사용.. 2025. 4. 18.
[TIL] 2025-4-17 리액트 생명주기 이번 강의에서는 리액트에서 생명주기라는 개념을 배웠는데 살짝 헷갈리는 부분들이 있어서 정리해보았습니다.사실 생명주기라는 개념을 Vue작업하면서 겪어보긴 했지만 제대로 배우고 작업했던게 아니라 코드 읽고 쓰면서 느낌으로 배웠던지라 생명주기에 대해 잘이해하고 있는거 같지 않아서 (그래서 뭔가 쓰라고 하면 쓰는데 잘 설명할수는 없는 느낌이랄까요..)이번에 생명주기에 대해서 제대로 정리해보려고 합니다. 리액트 생명주기란?컴포넌트가 화면에 나타나고, 업데이트되고, 사라지는 과정이 각각의 과정속에 설정해둔 특정 함수를 자동으로 호출해 줍니다.-> 더 쉽게 말하자면 컴포넌트가 처음 나타났을 때 뭘 실행할지, 업데이트 되면 뭘 실행할지, 사라질때 뭘 실행할지 정확히 컨트롤 할수 있다는것! 생명주기의 흐름1. 탄생(Mo.. 2025. 4. 17.