kasumil의 코딩 공작소

신규 프론트엔드 개발자로 취업했다가 php를 배우고 코드이그나이터3, 4를 이용한 사이트 개발을 배웠는데,php는 인기가 없는 언어이고, react로 돌아갔더니 거진 PRD, IA, usecase를 통한 문서 개발을 진행하지 않아서,주먹구구식 개발로 기획문서 하나만 받아서 그런지회사에서 배운게 없네... 프레이머는 스크롤 모션때문에 배웠는데, 리액트 훅 폼은 컨트롤이 어려워서 못 쓰던거고,나머지는 처음보는 것들이네... 회사는 주먹구구 개발만 안해도 좋은 회사인듯 싶다.https://lucide.dev/guide/packages/lucide-react Lucide IconsBeautiful & consistent icon toolkit made by the community.lucide.devhttps:..

this?이게 왜 어렵나 하면, 그때그때 다른값을 가르키기때문이다. 자바스크립트 전역컨객체를 가리킨다. 함수 vs 메서드 thisthis가 어려운 이유는 아래와 같다.var obj = { outer: function () { console.log(this); var inner = function () { console.log(this); }; inner(); var obj2 = { innerMethod: inner, }; obj2.innerMethod(); },};obj.outer();/// 응답값 // {outer: ƒ}// Window {0: global, window: Window, self: Window, document: document..

실행컨텍스트란? 실행할 코드에 제공할 환경 정보들을 모아놓은 객체. 실행컨텍스트는 기본적으로 stack방식으로 진행되며그 내부에는 this binding, variable enviroment, lexical enviroment로 구성.이중 variable enviroment, lexical enviroment 내부에는 enviromentRecord와 hoisting이 들어 있는데,enviromentRecord 내부에는 식별자(변수명)들이 저장됨.이때, 호이스팅이 진행되어 사용될 변수, 함수들이 최상으로 끌어올려지게 작동됩니다. 해당 내용이 적용되면 코드를 한줄한줄 파서 할때랑 다르게 작동됩니다. 함수선언문은 함수표현식과 다르게 해당 내용이 중복될 경우 덧씌워버리지만 에러가 작동되지 않는다.그러나 표현식의..

자바스크립트 데이터 타입기본형(number, string, boolean, null, undefined, symbol)과참조형(object, array, function, date, regexp, Map, WeakMap, Set, WeakSet)이 존재함.  변수는 변할수있는 수식별자 변수의 이름. 변수를 선언let a; 변수 데이터 할당a = 'Hello World'; 이렇게 진행할 경우 메모리영역에서 아래와 같이 진행된다.변수 주소1000100110021003데이터 이름 : a값 : @3000  데이터 주소3000300130023003데이터"Hello World"   위와 같이 데이터영역과 변수 영역이 나누어진 이유는메모리의 낭비를 줄이기 위함과 가변적 메모리 길이에 대응하기 위함 위의 내용처럼 변수..

import { cookies } from "next/headers";import { NextResponse } from "next/server";import type { NextRequest } from "next/server";export async function middleware(req: NextRequest) { const cookieData = await cookies(); const token = cookieData.get("TokenData"); const publicPaths = ["/login", "/sign-up"]; const isPublicPath = publicPaths.includes(req.nextUrl.pathname); const isFile ..

기존 마이크로소프트의 코드푸쉬가 지원 종료될 예정이다. 3/31일부로...그렇기에 나도 코드푸쉬를 배우려다가 해당 내용을 skip하고, hot-updater로 적용하려고 한다. https://gronxb.github.io/hot-updater/index.html Hot UpdaterSupport New / Old ArchitectureCompatible with both the new and old React Native architectures, offering maximum flexibility for your projectsgronxb.github.io 설치단계1. https://gronxb.github.io/hot-updater/guide/getting-started/quick-start-with..

https://github.com/microsoft/react-native-code-push/issues/2797 When we can expect new arch support for React Native Code Push? · Issue #2797 · microsoft/react-native-code-pushI’m reaching out to inquire about the plans for integrating support for React Native’s new architecture into CodePush. As the new architecture becomes more widely adopted, will there be updates to ...github.com 안된다...0.77...

https://icon.kitchen/ IconKitchenCook up app icons for any platformicon.kitchen  아이폰과 안드로이드의 어플 아이콘 이미지를 자동생성해준다. 아이폰은 그냥 쓰면되지만, 안드로이드는 원형과 라운딩된 사각형을 두개만들어야한다. 앞서boot-splash 라이브러리를 사용하면 생성 명령어를 이용하여 적용하면, splash 이미지가 3개로 자동 적용되어있다.npx react-native-bootsplash generate [이미지 경로/파일명.확장자]자동 적용되어 안드로이드에 따로 설정할 게 없다.건드려도 되는건 오로지 ios Appdelegate.swift파일.안드로이드는 경로를 넣어야 하는데 좀 불편하다.[프로젝트명]/android/app/src/..

https://github.com/invertase/react-native-apple-authentication GitHub - invertase/react-native-apple-authentication: A React Native library providing support for Apple Authentication on iOS aA React Native library providing support for Apple Authentication on iOS and Android. - invertase/react-native-apple-authenticationgithub.com 방법은 어렵지 않다. // App.jsimport React from 'react';import { View } fr..

https://github.com/crazycodeboy/react-native-splash-screen GitHub - crazycodeboy/react-native-splash-screen: A splash screen for react-native, hide when application loaded ,it works on iOA splash screen for react-native, hide when application loaded ,it works on iOS and Android. - crazycodeboy/react-native-splash-screengithub.com 어플 화면설정할때 쓰는 라이브러리.보통 이걸 통해서 렌더링하는 속도를 숨겨 유저가 시간반응도를 낮춰준다. https:/..