나만 보는 개발 블로그

커뮤니티 프로젝트를 개발하기 위해선 이미지 기능은 필수불가결하다. 이미지 기능에서 가장 중요한 부분은 어떻게 저장하느냐 이다. Problem 처음 진행했던 프로젝트인 Travel Maker에선 협업을 하다보니 내 컴퓨터에서 올린 이미지가 다른 팀원의 컴퓨터에선 보이지 않기 때문에(로컬에 저장) 작업하기가 불편했다. 이러한 점 때문에 이미지를 Base64코드로 변환해서 DB에 저장하는 지금 생각하면 아주 무식한 방법으로 개발을 진행했다. 기능은 문제없이 잘 작동했다. DB에 있는 코드를 불러와서 이미지화 하면 되기때문에 협업도 잘 되었다. 하지만 문제는 이미지를 Base64코드로 변환하면 크기가 4배 ~ 10배정도 커진다는 문제 때문에 글을 쓸때 이미지를 4~5개 업로드하면 DB 컬럼의 데이터 타입을 Lo..

1. wsl 개발자 설정 -> 개발자 모드 켬 2. Linux용 Windows 하위 시스템 windows 기능 켜기/끄기 -> Linux용 Windows 하위 시스템 체크 3. Ubuntu 설치 Microsoft Store -> Ubuntu 설치 4. Ubuntu 실행 및 CodeServer 설치 $ sudo apt-get install build-essential net-tools 최신버전(4.17.1) 설치 $ wget -q wget -q https://github.com/coder/code-server/releases/download/v4.17.1/code-server_4.17.1_amd64.deb $ sudo dpkg -i code-server_4.17.1_amd64.deb config파일 수정 ..

원형 이미지 import 'bootstrap/dist/css/bootstrap.min.css'; import Image from 'react-bootstrap/Image'; bootstrap 이용. nth :nth-child() ex) .클래스이름 :nth-child(숫자) ex) 3번째 자식 제외하고 적용 .second_block>div:not(:nth-child(3)) hr태그 꾸미기 Community🌐 /{" "} 자유게시판⚽ /* 상단 구분선 시작*/ .division_line { position: relative; display: flex; margin: 32px 0; } .division_line > div { background-color: white; color: #999999; displ..

// 스크롤기능 const scrollRef_port = useRef(null); const scrollRef_market = useRef(null); const [isDrag, setIsDrag] = useState(false); //드레그 중인지의 상태확인 const [startX, setStartX] = useState(); //처음 클릭한 x좌표 const onDragStart_port = e => { e.preventDefault(); setIsDrag(true); setStartX(e.pageX + scrollRef_port.current.scrollLeft); }; const onDragStart_market = e => { e.preventDefault(); setIsDrag(true); ..

1. git reset --hard 커밋아이디 2. git push -f origin master(branch 이름) 리셋 시점 이후 커밋 싹 날라감

1. git init 2. git add. 3. git remote add origin repo주소 (remote 삭제) git remote rm origin