Byte by Byte
close
프로필 배경
프로필 로고

Byte by Byte

  • 분류 전체보기 (145)
    • 웹 개발 일기 (74)
      • [LG유플러스] 유레카 (72)
    • Study Notes (50)
      • JavaScript (9)
      • TypeScript (2)
      • Programmers (4)
      • JAVA (1)
      • React (17)
      • 알고리즘 (9)
      • Framer Motion (5)
    • Project & Challenge (20)
      • [Project] 웹 아키텍처의 이해 (7)
      • [Project] 잡생각 - 진로탐색 및 채용연계.. (9)
      • [Project] 잇플레이스 - 통신사 멤버십 혜.. (2)
      • [Challenge] 나만의 포트폴리오 사이트 제.. (1)
      • [Project] 동행이음 - 의료취약계층 셔틀 .. (1)
      • [Project] 감정 일기장 - 한 입 리액트 .. (0)
    • 이모저모 (1)
  • 홈
  • 태그
  • 방명록
[알고리즘] 문제 해결 접근법, 문제 해결 패턴

[알고리즘] 문제 해결 접근법, 문제 해결 패턴

목 차문제 해결 접근법문제 해결 패턴빈도수 세기 패턴다중 포인터 패턴슬라이딩 윈도우 패턴분할과 정복 패턴문제 해결 접근법 🔷PROBLEM SOLVING어려운 문제에 어떻게 접근해야할까?1. Devise a plan for solving problems 👉 여기서 다룰 내용! 2. Master common problem solving patterns 1️⃣Understand The Problem "단계별로 문제를 생각하자"Can I restate the problem in my own words?What are the inputs that go into the problem?What are the outputs that should come from the solution to the problem..

  • format_list_bulleted Study Notes/알고리즘
  • · 2025. 4. 7.
  • textsms
[알고리즘] 빅오 표기법 (Big O Notation), 배열과 오브젝트의 성능 평가

[알고리즘] 빅오 표기법 (Big O Notation), 배열과 오브젝트의 성능 평가

배운 내용 요약 정리빅오 표기법 (Big O Notation)배열과 오브젝트의 성능 평가 빅오 표기법 (Big O Notation) Big O 소개 - '좋은', '그저그런', '엉망인' 코드라고 말하는 대싯 숫자로 코드의 성능을 표기할 수 있는 지표- 입력의 크기와 실행시간의 관계를 말함 Big O Notation is a way to formalize fuzzy counting.It allows us to talk formally about how the runtime of an algorithm grows as the inputs grow. O(n) operaion inside of an O(n) operaion. == O(n^2) (eg. 중첩 반복문)Simplifying Big O Expres..

  • format_list_bulleted Study Notes/알고리즘
  • · 2025. 4. 7.
  • textsms
[React] 리액트 기초 복습: 리액트 이해, JSX, npm과 yarn

[React] 리액트 기초 복습: 리액트 이해, JSX, npm과 yarn

리액트 시작 🎯리액트 이해리액트는 자바스크립트 라이브러리로 사용자 인터페이스를 만드는 데 사용한다.구조가 MVC, MVW 등인 프레임워크와 달리 오직 V(view)만 신경 쓰는 라이브러리다. 🔹컴포넌트: 리액트 프로젝트에서 특정 부분이 어떻게 생길지 정하는 선언체: 재사용이 가능한 API로 수많은 기능들을 내장하고 있으며, 컴포넌트 하나에서 해당 컴포넌트의 생김새와 작동방식을 정의 🔹 렌더링: 사용자 화면에 뷰를 보여 주는 것: 리액트가 렌더링 과정에서 최적의 사용자 경험을 제공하며 성능을 아낀 비밀을 파악하려면'초기 렌더링'과 '리렌더링' 개념을 알아야 함 🔸초기 렌더링어떤 UI 관련 프레임워크, 라이브러리를 사용하든지 간에 맨 처음 어떻게 보일지를 정하는 초기 렌더링이 필요하다.리액트에서는 이..

  • format_list_bulleted Study Notes/React
  • · 2025. 4. 7.
  • textsms
[React] State Lifting (with. 카운터 앱 만들기)

[React] State Lifting (with. 카운터 앱 만들기)

(리액트) 카운터 앱 만들기 📌가운데 정렬 cssmargin: 0 auto; import "./App.css";import Viewer from "./components/Viewer";import Controller from "./components/Controller";function App() {  return (          Simple Counter                                              );}export default App; 변경된 값이 컴포넌트가 즉시 렌더링 하여 화면에 반영하도록 하려면 state값으로 설정해야 한다.state는 컴포넌트 내부에서만 만들 수 있다.그럼 이때 state를 어디에 설정해야 할까? state의 값을 실제로 렌더링하게 ..

  • format_list_bulleted Study Notes/React
  • · 2025. 4. 7.
  • textsms
[React] public 폴더와 assets 폴더 차이

[React] public 폴더와 assets 폴더 차이

(리액트) public폴더와 assets폴더 차이 둘 다 동일하게 정적파일을 보관하는 용도인데왜 폰트는 public폴더에 넣고, 이미지는 assets폴더에 넣나요? 그 이유는 바로 Vite가 내부적으로 진행하는 이미지 최적화 설정때문에 그렇다. 그렇기에 이미지를 최적화할게 아니라면 public폴더에 넣어도 상관없다.이 경우 상대경로를 통해 이미지를 불러와야한다.이 경우 이미지를 import가 아니라 img태그로 src프로퍼티를 사용해 넣는다. 만약 import문으로 간편하게 불러오고 싶다면 assets에 넣어야만 한다.이때 util폴더를 만들어 get-image.js와 같은 모듈을 따로 만들어서 넣어주는게 좋다.import emotion1 from "./../assets/emotion1.png";impo..

  • format_list_bulleted Study Notes/React
  • · 2025. 4. 7.
  • textsms
[React] 리액트 페이지 라우팅

[React] 리액트 페이지 라우팅

목차 MPA: Multi Page ApplicationSPA: Single Page ApplicationReact Router페이지 라우팅: 페이지 이동페이지 라우팅: 동적 경로페이지 라우팅 🔷MPA: Multi Page Application애초에 서버가 여러개의 페이지를 갖고 있음동작 방식이 굉장히 직관적이기 때문에 많은 서비스가 사용하는 전통적인 방식→ React.js는 이 방식을 따르지 않음(쾌적한 페이지 이동 제공이 어렵기 때문) 🔹MPA 방식의 단점페이지 이동이 쾌적하지 못하다. 계속해서 페이지의 전체를 새로고침하므로 깜빡거림 서버의 부하가 심해진다. 페이지 요청마다 서버에게 모든 요청이 감🔹 서버 사이드 렌더링: Server Side Rendering서버 측에서 미리 완성해놓은 파일을 보..

  • format_list_bulleted Study Notes/React
  • · 2025. 4. 7.
  • textsms
  • navigate_before
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • navigate_next
전체 카테고리
  • 분류 전체보기 (145)
    • 웹 개발 일기 (74)
      • [LG유플러스] 유레카 (72)
    • Study Notes (50)
      • JavaScript (9)
      • TypeScript (2)
      • Programmers (4)
      • JAVA (1)
      • React (17)
      • 알고리즘 (9)
      • Framer Motion (5)
    • Project & Challenge (20)
      • [Project] 웹 아키텍처의 이해 (7)
      • [Project] 잡생각 - 진로탐색 및 채용연계.. (9)
      • [Project] 잇플레이스 - 통신사 멤버십 혜.. (2)
      • [Challenge] 나만의 포트폴리오 사이트 제.. (1)
      • [Project] 동행이음 - 의료취약계층 셔틀 .. (1)
      • [Project] 감정 일기장 - 한 입 리액트 .. (0)
    • 이모저모 (1)
최근 글
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바