수민's 개발 이야기

고정 헤더 영역

글 제목

메뉴 레이어

수민's 개발 이야기

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기 (71)
    • 👩🏻‍💻frontend개발자로 성장해나가기 (19)
    • 🔫Trouble Shooting (6)
    • 🤖 프론트엔드 개발자의 NLP 도전기 (3)
    • 😃 프로젝트를 마치며.... (2)
    • 🙏 프론트엔드 개발자의 코딩테스트 뿌수기 (1)
      • 자기주도 스터디 (0)
      • 밀라 알고리즘 스터디 (28)
    • SQLD기본개념 (2)
    • 구름톤 유니브 숙명여대 3기 회고록 (8)
    • DJANGO스터디 (1)

검색 레이어

수민's 개발 이야기

검색 영역

컨텐츠 검색

전체 글

  • [Google Colab] GPU로 모델 돌리는 법

    2025.03.26 by qkrtnals

  • [floating Label] 움직이는 placeholder 만들기

    2025.03.05 by qkrtnals

  • [recoil] 그럼 Recoil은 언제 써야해요 ?

    2025.02.21 by qkrtnals

  • [Recoil]상태 관리 라이브러리 도전기

    2025.02.19 by qkrtnals

  • [React-Query] React-Query가 뭔데요?

    2025.02.18 by qkrtnals

  • 15486 : 퇴사2

    2025.02.02 by qkrtnals

  • 백준 1495 : 기타리스트

    2025.01.31 by qkrtnals

  • 백준 11726 : 2 x n 타일링

    2025.01.30 by qkrtnals

[Google Colab] GPU로 모델 돌리는 법

구글 코랩에서 GPU가 있는데 이걸 어떻게 쓰는거야.. 하다가 그냥 CPU를 사용했다..ㅋㅋㅋㅋ 그랬더니 어제 새벽 5시까지 돌렸는데 고작 8프로만 수행되는 최악의 일이 발생했다 ✅ 코랩의 장점- 사용하고자 하는 라이브러리를 추가 설치 필요 없이 !pip install ~ 로 쉽게 불러올 수 있다- 그래픽 카드가 필요없다 -> GPU를 제공해줘서 ML 작업이 수월하게 가능하다(그게 아니었으면 아마 노트북 터졌을거다..) 1️⃣ 런타임을 눌러 런타임 유형 변경을 누른다 2️⃣ 런타임 유형을 CPU에서 T4 GPU로 변경한다 어제 새벽 5시까지 돌려서 8%를 채웠는데 40분 돌린 지금 이미 30%가 되었다 .. GPU 최고 ..👍

🤖 프론트엔드 개발자의 NLP 도전기 2025. 3. 26. 11:55

[floating Label] 움직이는 placeholder 만들기

처음 디자인을 받고 placeholder가 움직이고... 비키는게 현실적으로 가능한가?했는데 불가능은 없다 🤣 이 비현실적인 UI의 진실은 placeholder가 placeholder가 아니라는 것에 있다 😉내가 작성한 코드를 자세히 보면 움직여야할 placeholder가 안보인다.CSS와 React의 useState를 활용하여 상태에 따라 라벨 위치를 변경하는 방식으로 구현을 진행했기 때문이다. 👩🏻‍💻구현 코드  아이디를 입력하세요 setEmployeeId(e.target.value)} onFocus={() => setIsFocused(true)} onBlur={() => setIsFoc..

👩🏻‍💻frontend개발자로 성장해나가기 2025. 3. 5. 02:47

[recoil] 그럼 Recoil은 언제 써야해요 ?

Recoil이란? React 애플리케이션을 위한 상태 관리 라이브러리 Recoil같은 상태 관리 라이브러리를 사용해야 하는 경우1️⃣ 여러 컴포넌트에서 동일한 상태를 공유할 때 ex) 로그인 상태 , 사용자 정보 , 테마 설정 등❌ useState 사용 : 여러 컴포넌트에서 상태 공유 어려움                              : *prop drilling 이 발생할 수 있음 *prop drilling  : React에서 부모 컴포넌트의 데이터를 자식 컴포넌트로 전달할 때 중간 컴포넌트들이 불필요하게 prop을 전달해야 하는 문제2️⃣ 컴포넌트 간 상태를 동기화해야 할 때 ex) 필터 옵션 , 검색어, 사이드바 상태✅ 페이지 내 여러 섹션에서 동일한 데이터를 참조해야 한다면 Recoil을..

👩🏻‍💻frontend개발자로 성장해나가기 2025. 2. 21. 16:55

[Recoil]상태 관리 라이브러리 도전기

Recoil이란? React 애플리케이션을 위한 상태 관리 라이브러리 💻첫 상태관리 라이브러리를 Recoil을 선택한 이유 : react랑 가장 사용법이 비슷해서 러닝커브가 제일 적어서 선택작고 React스러운: recoil이 React의 주요 철학인 선언적 UI, 컴포넌트 중심의 설계, 그리고 훅스를 사용하는 방식을 기반import React from 'react';import { atom, useRecoilState } from 'recoil';const textState = atom({ key: 'textState', default: '', });function TextInput() { const [text, setText] = useRecoilState(textState); const..

👩🏻‍💻frontend개발자로 성장해나가기 2025. 2. 19. 02:53

[React-Query] React-Query가 뭔데요?

더보기프론트엔드 개발자로 성장하기 위해서 큐시즘이라는 동아리에서 개발을 달리게 되는데 당장이라도 React-Query 등 안써본 개념들을 써봐야하기에 공부를 시작! 🖌️React-Query란?: fetching , caching, 서버 데이터와의 동기화를 지원해주는 라이브러리 ➡️ *ContextAPI를 기반으로 동작 *ContextAPI란 ?  : 리액트의 내장 API / 컴포넌트에게 props를 사용하지 않고 필요한 데이터를 쉽게 공유할 수 있게 해줌     ➡️ 모든 컴포넌트에서 사용할 수 있는 데이터를 전달하는데 유용 ➡️ React-Query를 활용해 비동기 데이터를 불러오는 과정 중 발생하는 문제들을 해결해줌🖌️Caching : 캐싱React-Query는 캐싱을 통해 동일한 데이터에 대한 ..

👩🏻‍💻frontend개발자로 성장해나가기 2025. 2. 18. 02:02

15486 : 퇴사2

💡기본 정보유형: DP풀이 날짜: 2025년 01월 31일 풀이방법 한줄 요약: i번째 날의 일을 선택하는지 안하는지에 맞춰 최댓값 확인 💡문제에서 구해야 할 것상담원으로 일하고 잇는 백준이는 퇴사를 하고자 함오늘부터 N+1일 째 되는 날 퇴사를 하기 위해서 남은 N일 동안 최대한 많은 상담을 하려고함 백준이는 비서에게 최대한 많은 상담을 잡으라고 부탁했고 비서는 하루에 하나씩 서로 다른 사람의 상담을 잡아둠 Ti : 상담을 완료하는데 걸리는 기간Pi : 상담을 했을 때 받을 수있는 금액 N=7인 경우에 다음과 같음1일에 잡혀있는 상담은 총 3일이 걸리며 상담했을 때 받을 수 있는 금액은 10 , 5일에 잡혀있는 상담은 총 2일이 걸리며 받을 수 있는 금액은 15상담을 하는데 필요한 기간은 1일보다 ..

🙏 프론트엔드 개발자의 코딩테스트 뿌수기/밀라 알고리즘 스터디 2025. 2. 2. 00:01

백준 1495 : 기타리스트

💡기본 정보유형: DP풀이 날짜: 2025년 01월 31일 풀이방법 한줄 요약: bottom-up형식으로 점화식을 활용해서 범위 동안 반복문 사용 💡문제에서 구해야 할 것기타리스트 강토는 다가오는 공연에서 연주할 N개의 곡을 연주하고 있음 . 공연이 시작하기 전에 각각의 곡이 시작하기 전에 바꿀 수 있는 볼륨의 리스트를 만들었음. 이 리스트를 V라고 했을 때 V[i]는 i번째 곡을 연주하기 전에 바꿀 수 있는 볼륨을 의미. 항상 리스트에 적힌 차이로만 볼륨을 바꿀 수 있음현재 볼륨이 P이고 지금 i번 째 곡을 연주하기 전이라면 i번 곡은 P+V[i] 나 P-V[i]로 연주해야함 하지만 0보다 작은 값으로 볼륨을 바꾸거나 M보다 큰 값으로 볼륨을 바꿀 수 없음곡의 개수 : N시작 볼륨 : S최댓값 : ..

카테고리 없음 2025. 1. 31. 23:47

백준 11726 : 2 x n 타일링

💡기본 정보유형: DP풀이 날짜: 2025년 01월 30일 풀이방법 한줄 요약: bottom-up형식으로 점화식 세워서 구현 💡문제에서 구해야 할 것2*n 크기의 직사각형을 1*2 , 2*1 타일로 채우는 방법의 수를 구하는 프로그램- 입력 : 첫째 줄에 n이 주어짐- 출력 : 첫째 줄에 2*n크기의 직사각형을 채우는 방법의 수를 10,007로 나눈 나머지 출력 💡알고리즘 설계- Bottom-up 방식으로 반복문 구현- dp[1] = 1- dp[2] = 2- dp[3] = 3- dp[4] = dp[3] + dp[2] = 5     => dp[N] = dp[N-1] + dp[N-2] : 점화식💡CODEconst fs = require("fs");const N = Number(fs.readFileSy..

🙏 프론트엔드 개발자의 코딩테스트 뿌수기/밀라 알고리즘 스터디 2025. 1. 30. 21:14

추가 정보

인기글

최신글

페이징

이전
1 2 3 4 5 6 7 ··· 9
다음
TISTORY
수민's 개발 이야기 © Magazine Lab
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바