본문 바로가기
  • 어서오세요.
  • 안녕하세요~

분류 전체보기84

🔥성능이 놀라워요🔥 무료로 한국어🇰🇷 파인튜닝 모델 받아서 나만의 로컬 LLM 호스팅 하기 https://www.youtube.com/watch?v=VkcaigvTrug&t=581s 2024. 7. 2.
피그마 플러그인 설치 방법 #Unsplash - 고해상도 이미지 Import 플러그인Figma에서 강좌를 만들 때 가장 많이 사용하는 Plugin은 Unsplash입니다. 더미 이미지로 사용하기에 괜찮기 때문인데요. 우선 피그마 플러그인 설치 방법을 알려드릴게요.   영상의 플레이  버튼을 클릭하시면 영상으로 알려드립니다.  Unsplash 플러그인 빠른 설치 Tip    빠른 설치 Tip 이 링크로 접속하여 우측 상단의 Install 버튼 클릭 (위 화면 참고) 플러그인을 검색하여 설치하는 방법피그마에 로그인 후 왼측 사이드 메뉴 중 Plugins(또는 Community) 클릭 페이지의 하단에 있는 Browse Plugins 선택목록에서 바로 설치하거나 검색으로 찾아서 설치   * 주의 : Unsplash를 상업적으로 이용 시 .. 2024. 7. 1.
React에서 터치 스와이프 구현하기 배경우테코에서 개발하고 있는 요즘카페 서비스에선 메인 화면의 카페들을 스와이프 형식으로 보여주고 있습니다. 따라서 터치 스와이프 구현이 필요합니다.이 글에서 JavaScript로 구현한 scroll snap의 소스 코드는 https://gist.github.com/solo5star/ca5788e3c2b75c3c8ab017a4fb97c438 에서 확인할 수 있습니다정말 간단하게 구현하기 (CSS).container { height: 500px; overflow-y: scroll; scroll-snap-type: y mandatory;}.container > .item { scroll-snap-align: start;}터치 스와이프를 구현하는 정말 간단한 방법은 CSS의 scroll-snap을 사용하.. 2024. 7. 1.
React에서 터치 스와이프 구현하기 2 (유한 상태 머신으로 리팩토링) 배경지난 글에서 요즘카페 서비스의 터치 스와이프를 고도화하는 구현을 진행했었습니다.요구사항 1, 2까지 구현했었는데요, 터치하였을 때 터치에 반응하여 요소가 따라오게 하는 구현이랑, 판정을 통해 이전 혹은 다음 요소로 snap이 일어나게 하게끔 구현해보았습니다.// 모든 경우에서 사용const [scrollPosition, setScrollPosition] = useState(0);// 터치 중일 때 사용 (그 외엔 null)const [prevPosition, setPrevPosition] = useState(null);const [recentPosHistory, setRecentPosHistory] = useState(null);// snap 애니메이션 중에 사용 (그 외엔 null)const [sn.. 2024. 7. 1.