먼저 들어가기에 앞서, 보통 아래와 같이 매개변수나 리턴타입을 Union타입을 이용하여 상황에 맞게 함수를 사용하였을 겁니다.function coordinate(x: number | string, y: number | string): string | number { if (typeof x === "string" && typeof y === "string") { return x + y; } else { return Number(x) + Number(y); }}console.log(coordinate(1, 2)); // 3console.log(coordinate("1", "2")); // 12console.log(coordinate(1, "2")); // 3 (의도되지 ..
1. 모바일 퍼스트 - 먼저 모바일을 위한 디자인을 하고 더 큰 화면에 맞게 확장 2. 유연한 그리드 - 레이아웃에 고정 단위 대신 백분율 사용 3. 미디어 쿼리 모바일(소형)브레이크 포인트 (최대 320px)iPhone5 시대의 스마트폰모바일(중형)브레이크 포인트 (321px ~ 480px)대부분의 스마트폰ex) iPhone 15 Pro(393x852), iPhone 15 Pro Max(430x932), Samsung Galaxy S9+(360x740)모바일(대형)/태블릿브레이크 포인트 (481px ~ 768px)큰 스마트폰 및 소형 태블릿ex) iPad Mini(768x1024)태블릿브레이크 포인트 (769px ~ 1024px)표준 태블릿ex) iPad Pro(1024 x 1366)데스트톱브레이크..
SOP, CORS에 대해서 알아보기에 앞서 간단하게 이 출처(Origin) 라는 것이 정확히 뭘 의미하는지부터 한번 짚고 넘어가도록 해야 합니다. # Origin https://developer.mozilla.org/ko/docs/Web/HTTP/Headers/Origin Origin - HTTP | MDN Origin request 헤더는 fetch가 시작되는 위치입니다. 경로 정보는 포함하지 않고 서버 이름만 포함합니다. POST requests에 포함되는 것처럼, CORS requests 와 함께 전송합니다. Referer 헤더와 비슷하지만, ori developer.mozilla.org fetch가 시작되는 위치입니다. 경로 정보는 포함하지 않고 서버 이름만 포함합니다. 즉, Protocol + ..
2023년 1월 30일 고요한 새벽.. 멍하니 있을 시간이 없을 정도로 달리고 있는 와중에, 문득 느지막이 2022년 회고를 쓰고 싶어졌다. 사실 매년 남의 회고만 보고 멋있다, 대단하다고만 생각을 해봤지, 생전 처음 써보는 회고는 익숙하지 않아 벌거벗은 느낌이지만, 나의 2023년은 이전과는 달리 확실히 다른, 새로운 시작일 것 같은 기운이 느껴져 매년 써보기로 스스로에게 약속해본다. 2022년 2가지 큰 이슈 회사의 폐업이라는 불행과 결혼이라는 행복이 공존하는 한 해였다. 전에 배달 관련 회사에서 iOS 개발자로 일을 하다, 초기 단계의 스타트업을 경험하고 싶은 마음 저~ 한 구석의 욕망? 열정?으로 인해 이직을 하게 되었다. 초기 스타트업이다 보니 모든 초기 환경을 구축했다. 기업용 애플 계정 설정..
Redux란? 등장 배경 리덕스가 무엇인지 알아보기 전에 리덕스가 왜 필요할까? 고민해볼필요가 있습니다. 리액트에선 일반적으로 State를 관리 할 때는 props를 통해 부모에서 자식 컴포넌트의 방향(단방향 데이터)으로 데이터 흐름이 일어난다. 💡 State - 상태란 의미는 단순히 정상, 비정상인 상태를 뜻하기 보다는 데이터 의미에 가깝다. 즉, 리액트 컴포넌트의 변경 가능한 데이터(DATA)를 뜻한다. 1. 양방향 흐름 지양 부모와 자식 컴포넌트 모두가 데이터를 직접 변경이 가능하다 간단한 화면에선 단순하게 부모와 자식의 데이터간에 데이터를 직접 호출해서 동기화함으로 좋아 보일수 있다. 하지만 복잡한 프로젝트에 컴포넌트들의 잦은 변경이 존재한다면 데이터 흐름을 예상하기 어렵다는 큰 단점이 존재한다...
JSON이란? JSON(Javascript Object Notation)은 여러 형태의 데이터 구조화된 객체에 담아 처리하는 포맷 입니다. 즉, 숫자, 문자, 참 또는 거짓 등 모든 시리얼화 가능한 값(Serializable Value) 또는 Key-Value로 이루어진 객체(Object)에 담아 처리하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 포맷입니다. 가공된 JSON데이터는 텍스트 기반이기 때문에 사람이 쉽게 저장된 데이터를 읽고 수정할 수 있다는 장점이 있습니다 💡Serializable? 💡 직렬화(Serialization), 역직렬화(Deserialization) 직렬화란 Object를 Byte형태로 변환하는 기술을 뜻합니다. 즉, 객체를 저장하거나 메모리, DB, 파일등으로 데이터를 옮길..