기록으로 더 오래 기억하자

svg 로더를 설치하고 import하는 과정에서 빨간줄이 나타났다.jsx를 사용할 때는 별도의 처리 없이 에러가 발생하지 않지만 tsx를 사용할 때는 타입을 선언해주지 않으면 발생한다고 한다.declare module '*.svg' { import React from 'react'; import {SvgProps} from 'react-native-svg'; const content: React.FC; export default content;}루트 폴더에 custom.d.ts 파일을 생성해주고 위의 내용을 채워주면 에러가 사라진다.png 파일도 타입을 선언해주지 않아서 빨간줄이 뜬다.역시 custome.d.ts에 코드를 추가해주면 해결된다.declare module '*.png' { const..

vite로 프로젝트를 생성하고 App.tsx 파일을 열었는데 빨간줄로 도배가 되어 있었다.검색해본 결과 react와 typescript 버전 호환에 대한 문제였다.react버전에 맞춰 typescript 버전을 최신화해주어야 정상 작동한다고 한다. npm install typescript@latest --save-dev# 또는yarn install typescript@latest --save-dev타입스크립트 버전을 업그레이드 한 뒤 에러가 깔끔하게 사라졌다✨

12장 함수(1)12.1 함수란?✅ 함수일련을 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것으로 함수 정의를 통해 생성한다. ✅ 함수 호출함수에 매개변수를 인수로 전달하면서 함수의 실행을 명시적으로 하는 것이다.함수를 호출하면 코드 블록에 담긴 문들이 일괄적으로 실행된고, 실행 결과를 반환한다.// 함수 정의function add(x, y) { return x + y;}// 함수 호출const result = add(2, 5); 12.2 함수를 사용하는 이유✅ 함수를 사용하는 이유코드의 중복도를 낮춰주고 유지보수의 편이성과 코드의 신뢰성이 높아진다.실행 시점을 개발자가 결정할 수 있고 몇 번이든 재사용이 가능하다.함수는 이름(식별자)를 붙일 수 있으므로 역할을 분명히하는..

색상의 변경이 일어나는 이미지의 경우 svg를 사용하는 것을 선호하는 편이다.png 파일은 색상 변경이 되지 않기 때문에 active되어 색상이 변경된 파일과 원본 파일 2개의 파일이 필요하다.하지만 svg는 색상 변경이 가능하기 때문에 png파일과는 달리 1개의 파일로 컨트롤이 가능하다.그래서 react-native에서 svg 파일을 사용하기 위한 설정을 추가해주었다. 1. svg 라이브러리 설치https://github.com/software-mansion/react-native-svg GitHub - software-mansion/react-native-svg: SVG library for React Native, React Native Web, and plain React web projects...

1. 원하는 폰트를 다운아래 링크에 있는 구글이나 자유한글 등 원하시는 사이트에서 적용하고자 하는 서체를 다운 받는다.https://fonts.google.com/?subset=korean Browse Fonts - Google FontsMaking the web more beautiful, fast, and open through great typographyfonts.google.comhttps://m.xn--bj0bl09buja348b.xn--3e0b707e/myboard/menu_list 자유한글 무료서체 무료폰트무료한글폰트 , 무료서체 , 상업적 사용가능 한글폰트 , 저작권 자유로운 무료폰트m.xn--bj0bl09buja348b.xn--3e0b707e  2. 다운받은 폰트를 프로젝트 내 폴더로 ..

11.1 원시 값원시 타입의 값객체(참조) 타입의 값변경 불가능한 값변경 가능의 값변수에 할당하면 확보된 메모리에는 실제 값이 저장된다.객체를 변수에 할당하면 확보된 메모리에는 참조 값이 저장된다.값에 의한 전달👉 다른 변수에 할당하면 원본의 원시 값이 복사되어 전달된다.참조에 의한 전달👉 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달된다.변수는 O값을 갖는다.변수의 값은 O다.변수는 객체를 참조하고 있다.변수는 객체를 가리키고 있다.11.1.1 변경 불가능한 값✅ 원시 타입의 값👉🏻원시 값은 변경이 불가능하다는 것은 변수가 아니라 값에 대한 진술이다.변수는 확보한 메모리 공간 자체이고 값은 변수에 저장된 데이터로 표현식이 평가되어 생성된 결과다.만약 원시 값이 변경..

ios simulator 실행 시 프로젝트명.xcworkspace 를 통해 실행이 되어야 하는데, 엉뚱하게도 프로젝트명.xcodeproj 를 통해 실행되어 에러가 발생할 수 있다는 블로그 글을 봤다.블로그 글에서 제시한 해결책대로 명령어를 쳐봤지만 에러가 계속해서 발생되었다. 터미널에 나타나는 에러를 유심히 봤는데 나름의 가이드(?)를 제공해주는 것 같았다. npx react-native doctor해당 명령어를 실행했더니 cocoaPods 관련에 x표시가 있는 것을 확인했다. cocoaPods가 제대로 설치 안되어서 발생한 것을 알게 되었다$ sudo gem install cocoapods 이 명령어만 실행해주면 수월하게 끝날 줄 알았지만 여전히 에러가 발생했고 날 괴롭혔다😭저 명령어를 입력해도 설치..

10.1 객체란?✅ 객체 타입객체 타입은 다양한 타입의 값(원시 값 또는 다른 객체)을 하나의 단위로 구성한 복합적인 자료구조다.자바스크립트는 원시 값을 제외한 나머지 값(함수, 배열, 정규 표현식) 등은 모두 객체다.변경이 불가능한 원시 타입과 다르게 객체 타입은 변경 가능한 값이다.✅ 객체0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티와 메서드로 구성되어 있다,프로퍼티는 키와 값으로 구성된다.✅ 프로퍼티 객체의 상태를 나타내는 값(data)키와 값으로 구성된다.✅ 메서드프로퍼티를 참조하고 조작할 수 있는 동작(behavior)프로퍼티 값이 함수일 경우 일반 함수와 구분하기 위해 메서드라 부른다.10.2 객체 리터럴에 의한 객체 생성✅ 자바스크립트이 객체 생성 방법객체 리터럴Object 생성자 함수생..

9.1 타입 변환이란?✅ 타입 변환기존 원시 값을 사용해 다른 타입이 새로운 원시 값을 생성하는 것이다.✅ 명시적 타입 변환(타입 캐스팅)개발자가 의도적으로 값을 변환하는 것let x = 10;x.toString()✅ 암묵적 타입 변환(타입 강제 변환)개발자가 의도와는 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 것👉🏻타입 변환의 결과를 예측할 수 있어야 한다.예측을 실패하면 오류를 생산할 가능성이 높아진다.let str = 10 + '';때로는 명시적 타입 변환보다는 암묵적 타입 변환이 가독성이 더 좋을 수 있다.(10).toString()10 + ''9.2 암묵적 타입 변환자바스크립트는 가급적 에러를 발생시키지 않도록 암묵적 타입 변환을 통해 표현식을..

✅ 제어문조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다. 8.1 블록문✅ 블록문0개 이상의 문을 중괄호로 묶은 것으로 코드 또는 코드 블록이라고 한다.블록문은 자체 종결성을 가지므로 블록문의 끝에는 세미콜론을 붙이지 않는다.8.2 조건문✅ 조건문주어진 조건식(표현식)의 평가 결과에 따라 코드 블록(블록문)의 실행을 결정한다.if-else문switch문8.2.1 if ~ else 문✅ if-else문조건식의 논리적 참/거짓에 따라 실행할 코드 블록을 결정한다.if문의 조건식이 불리언 값이 아닌 경우 암묵적 변환에 의해 불리언 값으로 변환된다.if(조건식1) { // 조건식1이 참이면 이 코드 블록이 실행된다.} else if(조건식2){ // 조건식2가 참이면 이 코드 블록..