PLAY WORLD

뇌과학 공부법 3가지

1. 입력이 아니라 인출이 되어야 한다.읽고 듣고 받아쓰는 것만 하면안된다.결국 테스트(빈 종이에 쓰기, 시험, 퀴즈)를 반복하여 인출 학습을 해야한다. 2. 반복하기하루만 공부해서 안된다.1시간, 1일, 3일, 일주일, 한달 후 총 5번 반복하기 (망각의 곡선 학습법) 3. 섞어서 공부하기하나만 쭉 파는 것은 위험하다.문제는 하나의 이론만이 아닌 응용해서 푸는 것이기 때문에조금씩 이런저런 내용을 학습하여 공부하는 것이 낫다. 뇌 과학에 대한 관심이 있는데 학습법에 결론은 위에 3가지다.간단하면서 어려운 것이다. 2번은 내가 게으르기때문에 될지는 잘 모르겠다.하지만 1, 3번은 시도하기 좋은 방법인 것 같다.3가지를 지키기 어렵다면 1, 3번이라도 시도해보자

웹서버 vs 웹 어플리케이션 서버- 웹서버 : 요청마다 항상 똑같은 파일 전달- 웹 어플리케이션 서버 : 요청에 대해 동적으로 변하는 파일 전달 (DB 값에 따른 렌더링) CSR vs SSR- CSR : WebServer를 통해 정적인 파일을 가저오고, 클라이언트(브라우저)에서 백엔드와 직접 통신하여 데이터를 받아옴- SSR : Web Application Server에서 백엔드와 통신 후, 클라이언트에 완성된 파일을 Next.js Pre-rendering?Next.js는 모든 페이지를 프리 렌더링한다.즉, CSR의 자바스크립트가 모든 작업 수행대신 Next.js가 각 페이지에 대한 html 생성성능, SEO 개선 가능

📌 navigate를 써야 할 때조건부 이동이 필요할 때 → 이미 같은 화면이면 새로 추가하지 않고 params만 업데이트.중복 화면을 피하고 싶을 때 → 예: Profile 화면은 하나만 유지하고 싶을 때.탭/드로어 네비게이터에서 화면 전환할 때 → push는 stack 전용이라 탭/드로어에서는 navigate가 기본.📌 push를 써야 할 때무조건 새로운 화면 인스턴스를 추가하고 싶을 때 → 같은 화면이라도 새로 쌓아서 독립적인 상태를 유지.같은 화면을 여러 번 열어야 할 때 → 예: Article 화면을 여러 개 열어서 각각 다른 글을 보여주고 싶을 때.stack navigator에서만 사용 가능 → 탭/드로어에서는 동작하지 않음.✨ 간단 비교상황navigatepush같은 화면 중복 방지✅❌무조..

Static API 도입 배경기존 Dynamic API는 TypeScript와 딥링킹 설정을 수동으로 관리해야 해서 번거롭고 오류가 발생하기 쉬움.Static API는 더 단순한 방식으로 네비게이션 구조를 정의할 수 있어 코드베이스를 간결하게 유지 가능.Static API 기본 구조createStackNavigator에서 screens 속성으로 화면을 정의.createStaticNavigation을 호출해 네비게이션 컴포넌트를 생성.NavigationContainer와 유사하게 동작하며 대부분의 props를 지원.Dynamic API (기존 방식)import { createStackNavigator } from '@react-navigation/stack';const Stack = createStackN..

1. Static API새로운 Static API는 네비게이터 설정을 단순화하고, TypeScript 및 딥링킹을 더 쉽게 지원합니다. 기존 Dynamic API와 원칙은 같지만, 화면을 함수로 정의하는 대신 객체 기반 설정을 사용합니다.tsx// React Navigation 7 Static API 예시import { NativeStack } from '@react-navigation/native-stack';const RootStack = NativeStack({ screens: { Home: { screen: HomeScreen, path: 'home' }, Profile: { screen: ProfileScreen, path: 'profile/:id' }, }, initialRou..

📌 1. 코드 예시React Navigation 6tsx// React Navigation 6 딥링킹 예시import { NavigationContainer } from '@react-navigation/native';const linking = { prefixes: ['myapp://'], config: { screens: { Home: 'home', Profile: 'profile/:id', }, },};export default function App() { return ( {/* 네비게이터 정의 */} );}React Navigation 7tsx// React Navigation 7 딥링킹 예시 (Static API)import { N..

https://leetcode.com/problems/two-sum/description/https://www.algodale.com/problems/two-sum/https://dev.to/sushmeet/two-sum-problem-in-javascript-4aj2https://inpa.tistory.com/entry/JS-📚-자료형-Map-🚩-정리문제배열 안에서 두 수를 합쳐 target이 되는 것 찾기. 두 수의 인덱스를 배열로 반환키 포인트이중 for문 가능. HashMap 사용하면 더 빠름Map객체와 차이점? 객체의 key는 항상 스트링형태로 저장, 맵은 키에 다양한 자료형을 허용new Map() – 맵을 만듭니다.map.set(key, value) – key를 이용해 value를 저장합니..

https://leetcode.com/problems/contains-duplicate/https://www.algodale.com/problems/contains-duplicate/https://www.daleseo.com/js-sort-to-sorted/https://www.daleseo.com/js-set/문제동일한 수가 있는지 체크키 포인트O(n^2) 보다 빠른 실행, 이중 for문 안됨 ==> (1)정렬후 비교 또는 (2)Set 사용 (1)정렬sort() 함수 : (1)정렬하기 전에 배열 내의 값을 내부적으로 문자열로 변환하여 비교, (2)동일한 객체 반환(1)오름차순[-3, 2, 0, 1, 3, -2, -1].sort((a, b) => a - b); // [-3, -2, -1, 0, 1, 2,..

React 개발에서 ref와 useEffect는 가장 빈번하게 사용되는 핵심 도구입니다. 하지만 이 두 훅은 자주 사용되는 만큼, 그 내부 동작 원리나 적절한 사용 시점에 대한 오해도 많습니다. 단순히 "DOM에 접근할 땐 ref, API 호출할 땐 useEffect"라는 표면적인 이해를 넘어, 언제, 왜, 그리고 어떻게 사용해야 하는지를 깊이 있게 아는 것이 견고한 애플리케이션을 만드는 전문가의 역량입니다.이 블로그 게시물은 전문 개발자를 위해 두 훅의 근본적인 차이점부터 시작하여, 시너지를 활용한 고급 패턴과 현장에서 흔히 저지르는 실수까지 체계적으로 분석합니다. 이 글을 통해 ref와 useEffect에 대한 명확한 멘탈 모델을 정립하고, 실무에 즉시 적용 가능한 깊이 있는 인사이트를 얻는 것을 목..

디스코드란?디스코드는 채팅 애플리케이션입니다.보통 게임할때 많이 쓰는데 요즘은 온라인 커뮤니티 활동에서도 많이 쓰입니다.저는 게임은 잘 안해서 커뮤니티에 참가할때 많이 씁니다. 디스코드에 대해 알게 되었으니 이제 설치 방법에 대해 알아볼까요? 휴대폰(모바일)구글플레이스토어(대표 브랜드: 삼성, android)나 앱스토어(애플, ios)에 들어가서 ' 디스코드 '를 검색합니다.설치 후 실행하고나서 회원가입이나 로그인을 하면됩니다. PC(컴퓨터)인터넷 검색창에 ' 디스코드 '를 검색합니다.구글, 네이버 등등 어떤 곳이나 상관없습니다.2. 설치 하기위해 'Download for Windows'를 선택합니다.디스코드는 한국어 지원이 됩니다!홈페이지는 한국어로 안되어있지만 디스코드 실행할때는 한국어로 되어있으니 ..