본문 바로가기

전체 글

9월 석촌 호수 버스킹 일정표(IN 석촌호수 아뜰리에) 석촌 호수 아뜰리에 라는 곳에서 버스킹을 한다고 합니다. 일정표 입니다. 화/수는 거의 수업이고 목/금/토/일에 버스킹을 하는 것 같네요!~ 선촌후수 끝자락? 석촌호수 헬스장 옆에 아뜰리에 라는 곳에서 진행한다고 해요. 운동도 할겸 구경가야겠네요 😀 위치 https://naver.me/501jzsB7 석촌호수 아뜰리에 : 네이버 방문자리뷰 2 · 블로그리뷰 47 m.place.naver.com 더보기
Zustand [초간단 정리] [전역 상태 관리 라이브러리] 필자는 Redux로 전역 상태 관리를 할때 redux-tookit과 커스텀 훅을 만들어서 사용하였다. Zustand를 사용하연 위의 두가지를 합쳐놓은 것 같아 코드양도 줄고 사용하기 편한 것 같다. 먼저 store를 만든다. 상태 그룹핑 하기도 편한것 같다 아래 코드를 보면 이해가 될 것이다. import create from 'zustand' const useBearStore = create((set) => ({ bears: 0, increasePopulation: () => set((state) => ({ bears: state.bears + 1 })), removeAllBears: () => set({ bears: 0 }), })) 샘플의 함수 이름 부터가 커스텀 훅(use...) 이다. 컴퍼넌트에.. 더보기
D3 얕은 정리 [완전 기초] D3 (Data Driven Document)란? 단순 번역: 데이터 기반 문서 웹브라우저 상에서 동적이고 정보 시각화를 구현하기 위한 자바스크립트 라이브러리이다 svg(Scalable Vector Graphics) 해석 그대로 확장 가능한 벡터 그래픽이다. 그래픽을 마크업 하기 위한 특수 언어이다. 원이나 다각형, 선등을 지원해준다. w3school svg tutorial API select: 말그대로 선택한다는 뜻이다. jquery 와 문법이 많이 비숫하다. d3.select("body") append: select 로 선택된 요소에 자식요소 (tag) 를 추가 시킬수 있다. d3.select("body").append("svg") attr: attribute의 줄인말이다. 해당 태그의 속성을 추가 .. 더보기
React에서 Swiper 좌우 이동 method 사용하기 (with Typescript) 👆react에서 swiper 라이브러리를 사용하다가 첫번째 아이템으로 이동시켜야 하는 이슈가 생겼다. swiper버전 6.7.0 개발 환경 React & typescript 사용한 swiper method slideTo 사용방법은 swiper 공식 문서에 잘 나와있지만 React&typescript환경에서 정확한 Type과 Hook을 사용한 방법을 찾다가 관련 정보가 많지 않은 것 같아 정리 하게 되었다. https://swiperjs.com/swiper-api#method-swiper-slideTo Swiper API Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing na.. 더보기
나는 꽃 너는 방망이 나는 너를 보면 꽃을 주고 너는 나를 보면 방망이를 든다 나는 너를 보면 미소를 짓고 너는 나를 보면 화를 낸다 나는 너를 사랑하고 너도 나를 사랑한다. 사랑의 따듯하고 차갑고 감미롭고 변화무쌍하다. 사랑안에 모든일은 의미있는 것이다. 더보기
javascript 객체 프로퍼티 동적 생성? ( Object property dynamic add?) 어떻게 표현하는지 잘 모르겠지만... 🤪 (아래 코드로 봅시다!) 자바스크립트에서 객체에 프로퍼티를 동적으로 생성? 하는 간단한 코드를 발견하여 기록합니다. 프론트에서 서버로 정보 전달시 빈값에 대한 속성 자체를 보내지 말아달라는 요구 사항을 받을 때가 있습니다. 이슈 { name: '홍길동' age: '20' etc: '' //속성 자체를 제거 해주세요 } //아래와 같이 보내야함 { name: '홍길동' age: '20' } 이럴때 아래와 같이 작성하기 쉽습니다. (나만 그럴지도...) Worst Case //form에 입력된 값을 formData라고 할때 const {name, age, etc} = formData const submit = { name age } if (etc) { submit.e.. 더보기
Python 서버 구축 (FastAPI + uvicorn) - MAC사용자 기준 PIP (Pip Installs Packages, Pip Installs Python) 파이썬 패키지 라이브러리 관리 시스템이다. (프론트엔드의 npm, yarn과 비슷한 개념) 1. pip설치 여부 확인 MAC은 기본으로 python3가 설치 되어있다. pip도 pip3 명령어를 사용해야 한다. $ pip3 👆버전확인 $ pip3 -v 👆pip3 업그레이드 $ pip3 install --upgrade pip 혹시 pip가 설치 안되어있다면 인터넷에 pip설치하는 다른 글들이 있으니 참고 하면되겠다. FastAPI & uvicorn 설치 $ pip install fastapi 'uvicorn[standard]' Python code 작성 from fastapi import FastAPI app = Fas.. 더보기
너는 구름 나는 산 동산이었던 나는 올려다 봤네 구름을 태산이된 나는 내려다 보내 구름을 내 옆에 머무르는 너는 구름 나는 산 - 한라산 등반을 마치며 더보기