본문 바로가기

FRONT-END71

[Error] Page "src/app/~.page.tsx" has an invalid "default" export 문제 원인현재 프로젝트 진행 중에 서버 API로 요청을 받아 처리하지 않기 때문에,하드코딩으로 데이터를 임시로 넣어 아래와 같이 처리하고 있었습니다!interface Event { imageSrc: string link: string}interface EventPageProps { list: Event[]}const EventTempList = [ { imageSrc: '/images/sample.jpg', link: '/' },]export default function EventPage({ list = EventTempList }: EventPageProps) { return (...)} dev 환경에서 구동했을때는 전혀 오류가 나지 않고 잘 화면이 나왔는데,docker로 build되는 과정.. 2024. 5. 10.
리액트(React)의 역사 모던 리액트 Deep Dive 들어가며 내용을 토대로 정리한 내용입니다.현재 Front-end 시장은 React를 사용하는 회사들이 대부분입니다. 물론 TypeScript와 Next.js 등과 함께 사용되고 있습니다. 입사 후 너무 당연한 듯 React를 사용해왔지만, React가 등장하게 된 배경과 발전 과정들을 정리하고가면 좋을 것 같아 정리해보았습니다.React의 등장React는 2011년 지금의 메타인 페이스북의 뉴스피드 페이지에서 처음 선보여진 라이브러리입니다. 최근에는 전자정부 표준 프레임워크의 프론트엔드 개발 도구로도 채택이 되었다고 하는데, 이는 안전성과 유지보수성을 중요시하는 정부의 개발도구로도 채택이 될 만큼 안정성이 확보되었고 많은 개발자 사이에서 널리 쓰이고 있다고 이해할 수 있습니.. 2024. 5. 7.
[xcode] Dark, Light 모드 지정하기 시뮬레이터에서는 잘 나오던 화면이 핸드폰을 연결해 앱으로 열었더니! 아니... 내 글씨들 어디 갔어….? 왜 이래ㅠㅠ..하.. 한 땀 한 땀 배경색과 컬러를 지정해줘야 하나 싶어 지정하다가문득 드는 생각, 핸드폰으로 열면 다크모드로 보이게 처리가 되어있는 건가? 찾아보니 기본 설정으로는 시스템에서 설정한 모드를 따라간다고 한다!시스템 설정 모드와 관계없이 모드를 고정하고 싶다면 UserInterfaceStyle을 고정하여 이런 현상을 방지할 수 있다고 한다. 그래서 찾아봤더니 방법으로는 2가지가 나왔다.1. Info.plist에 추가2. SceneDelegate에 추가해서 light, dark 모드를 지정 방법 1. Info.plist에 추가이 방법을 찾아보며 알게 된 사실이 하나 있다.항상 Info.p.. 2024. 4. 1.
[iOS] Swift API Key 암호화하기 나는 현재 개인 프로젝트에서 오픈 API를 사용해 데이터를 받아오는 과정을 진행 중이다!근데 이제 API Key를 github에 올리면 문제가 되니까 암호화하는 방법을 다시금 찾아보고 적용하는데분명 해봤는데 왜 이렇게 오래 걸리지... 뭐였지...? 이게 최선이었나? 하는 마음이 들어 정리하고자 한다! 😂 방법 1. static 변수 활용하기하나의 파일을 만들어서 사용할 API Key를 static 변수로 묶어 전역적으로 사용하는 방법이다.class보다는 struct, enum을 활용해 사용한다.struct APIKey { static let aApiKey = "aksdlakdl1aksdla" static let bApiKey = "aksdlakdl1aksdla"}// 사용 시 APIKey... 2024. 3. 30.
Swift 심화 학습하기 (프로토콜, Never 타입, #keyPath와 #selector, 메타타입, availability) 프로토콜 Equatable 프로토콜 동일성 비교를 위한 프로토콜이다. 스위프트에서 제공하는 기본타입은 모두 채택하고 있다. 아래 메서드 구현이 해당 프로토콜의 요구사항이다. static func == (lhs: Self, rhs: Self) -> Bool 구조체, 열거형의 경우 Equatable 프로토콜 채택 시 모든 저장 속성이 Equatable 프로토콜을 채택한 타입이라면 비교연산자 메서드가 자동 구현된다. 단, 예외 케이스가 몇 가지 존재한다. 1) 클래스는 인스턴스를 비교하는 항등연산자(===)가 존재하기 때문에 비교연산자(==)는 개발자에게 구현이 위임된다. 2) 열거형의 경우 연관값이 없다면 기본적으로 Equatable, Hashable하기 때문에 Equatable 프로토콜을 채택하지 않아도 .. 2023. 8. 30.
Swift 고급연산자 숫자 리터럴 Swift는 숫자를 표기할 때 추가적으로 알아두면 좋은 몇가지 포인트들이 있다. 1. 2진법/8진법/16진법으로 직접 써 넣을 수 있다 2. 큰 숫자를 읽기 쉽게 하기위해 언더바(_)를 사용해도 된다 var num:Int = 0 num = 0b00011010 num = 0o31 num = 0x19 num = 1_000_000 또한, Swift에서는 Int/UInt 타입을 저장할 때 플랫폼 사양에 따라 다르지만 최근에는 64bit -> 8byte로 저장된다. 이는 Int64 / UInt64로 표기된다. 이를 확인하기 위해 MemoryLayout.size를 입력하면 메모리를 얼마나 사용하는지 알려준다. 오버플로우 오버플로우라는 개념은 값이 넘침을 의미한다. 예를들어 8비트를 담을 수 있는 공간에.. 2023. 8. 29.