개발 및 디자인에 유용한 무료 사이트 모음
개발 및 디자인 무료로 제공하는 사이트 및 꽤 쓸만한 사이트 정보
개발 및 디자인 무료 사이트 리스트
본 글은 개발 및 디자인 무료로 제공하는 사이트 및 꽤 쓸만한 사이트 정보를 모아놓은 글입니다.
주기적으로 업데이트할 예정입니다.
1. 오픈소스 Logo 및 아이콘 무료 제공 사이트
500,000개 이상의 오픈 라이선스 SVG 벡터 및 아이콘을 제공하는 사이트입니다.
`https://www.svgrepo.com/`이용약관에서 약간 찜찜한 면이 있습니다. 무료로 사용할 수 있는 아이콘들이 많지만, 일부 아이콘은 라이센스가 필요할 수 있습니다. 사용 전 라이센스를 반드시 확인해보세요. MIT 라이센스는 무료로 사용할 수 있습니다.
svgrepo 사이트는 저는 로고를 편하게 다운로드하기 위해 사용합니다. svgrepo 사이트의 Logo license는 무료 배포 복사 등 가능합니다. 단, 회사의 로고를 무단 수정하여 사용하는 것은 금지되어 있습니다.
2. Open Graph 및 Twitter Card 체크 사이트
`https://www.opengraph.xyz/`Open Graph 및 Twitter Card를 체크할 수 있는 사이트입니다. URL을 입력하면 해당 URL의 Open Graph 및 Twitter Card 정보를 확인할 수 있습니다.
- Open Graph 및 Twitter Card 메타 태그가 올바르게 설정되었는지 확인할 수 있습니다.
- 미리보기 이미지, 제목, 설명 등을 시각적으로 확인할 수 있습니다.
- 소셜 미디어에서 공유될 때 어떻게 보일지 미리 확인할 수 있습니다.
3. 코드 및 텍스트 비교(Diff, Compare) 사이트
`https://www.diffchecker.com/`텍스트, 이미지, PDF, Excel 등 다양한 파일 형식을 비교할 수 있는 사이트입니다. 두 개의 텍스트를 입력하면 차이점을 시각적으로 보여줍니다.
- 텍스트, 이미지, PDF, Excel 등 다양한 파일 형식을 비교할 수 있습니다.
- 변경된 부분을 색상으로 강조하여 쉽게 확인할 수 있습니다.
- 온라인에서 바로 사용할 수 있어 설치가 필요 없습니다.
4. 웹 기술 브라우저 지원 상태 확인 사이트
`https://caniuse.com/`HTML, CSS, JavaScript 등 웹 기술의 브라우저 지원 상태를 확인할 수 있는 사이트입니다. 특정 기능이 어떤 브라우저에서 지원되는지 쉽게 확인할 수 있습니다.
- 브라우저별 지원 상태를 그래프로 시각화하여 보여줍니다.
- 특정 기능에 대한 자세한 정보를 제공합니다.
- 최신 웹 기술의 지원 상태를 빠르게 확인할 수 있습니다.
5. 웹사이트 기술 스택 분석 사이트
웹사이트가 어떤 기술 스택으로 구축되었는지 분석해주는 사이트입니다. URL을 입력하면 해당 웹사이트에서 사용 중인 서버, 프레임워크, 라이브러리 등을 확인할 수 있습니다.
`https://builtwith.com/`- 웹사이트의 기술 스택을 상세히 분석하여 보여줍니다.
- 서버, 프레임워크, 라이브러리, 분석 도구 등 다양한 정보를 제공합니다.
- 경쟁사나 관심 있는 웹사이트의 기술 스택을 파악할 때 유용합니다.
Next js AWS Amplify 배포하기 (feat. github)
Next js 14+ SEO 설정하기 - open graph image, twitter image 설정하기
관련 태그