URL 단축 암호 - 셀프 코딩 부트캠프

한 달 전쯤 웹서비스를 만들려고 리액트 공부를 시작했습니다. 오늘 드디어 간단한 서비스 하나를 완성했습니다. 간단하다고 생각했는데 삽질을 하다 보니 오래 걸렸네요.

요즘 머니파이프라인, 엔잡러 라는 말들을 많이 합니다. 블로그 + 이 서비스로 이제 2개가 되었습니다. 야호!! 사람들이 많이 이용하면 좋겠네요..

 

http://lock.pub/

LOCK.PUB

제가 만든건 URL 단축 사이트입니다. 그냥 단축 URL 사이트는 흔한 것 같아서 비밀 주소 사이트를 만들었습니다. 단축 주소를 만들 때 암호를 지정할 수 있습니다.

메모를 추가해서 링크에 대한 정보를 보여주거나 힌트를 제공할 수 있습니다.
시작 날짜를 지정하면 시작 날짜 전까지는 숨겨진 링크로 이동할 수 없습니다
종료 날짜를 지정하면 종료 날짜 이후에는 숨겨진 링크로 이동할 수 없습니다
리다이렉트 횟수를 지정하면 지정한 리다이렉트 횟수 이후에는 숨겨진 링크로 이동할 수 없습니다.

생성한 링크는 서버에 암호화되어 저장되어 관리자도 알 수 없습니다

 

 

LOCK.PUB는 다음과 같이 용도로 사용할 수 있습니다
* 구글 드라이브 드롭박스 같은 링크에 비밀번호 추가
* 공유 컴퓨터에 북마크에 비밀번호 지정
* 서비스 오픈을 앞둔 페이지에 비밀번호 지정

 

후기

리액트 초보라 효과적으로 처리하지 못한 부분이 많이 있습니다. 특히 함수형 프로그래밍으로 생각하는 게 익숙하지 않아서 코드가 지저분합니다. 다음 프로젝트는 깔끔하게 하도록 노력해야겠네요.

버그도 있을 수 있으니 제보 부탁드립니다...

아래는 사용한 기술들입니다.

 

Nextjs

React 라이브러리의 프레임워크 중 하나입니다. 서버 사이트 렌더링이 쉬운 것 같아서 이걸로 선택했습니다. 사람들이 많이 쓰는 것 같기도 하구요.

 

Vercel

https://vercel.com/ vercel은 nextjs를 만든 곳입니다. 자기네가 만든 거니 제일 좋겠지...라고 생각해서 선택했습니다. 배포도 git에 push만 하면 돼서 아주 편리합니다. 이외에도 기능이 아주 많은데 1/100도 사용하지 못했네요.

개인 취미로 사용하면 공짜로 사용할 수 있습니다. 광고를 붙이면 상업용이 되기 때문에 결제를 해야 합니다. $20로 저렴합니다.

Vercel 가격표
https://vercel.com/pricing

Firestore

DB는 구글의 firestore를 사용했습니다. 딱히 마음에 들어서 쓴 건 아니고 초기에 공짜라서 사용했습니다. 무료 사용 할당량을 넘으면 돈을 지불해야 합니다.



파이어베이스 가격표

https://firebase.google.com/pricing?hl=ko