분류 기타

개발자를 위한 35 개의 웹 사이트 치트 시트

컨텐츠 정보

  • 조회 294 (작성일 )

본문

치트시트 란? 


웹 프로그래밍 기술의 급속한 발전으로 우리가 배워야 할 지식의 양이 증가하고 있습니다. 때로는 프로그래밍 언어 또는 프레임 워크의 모든 구문, 방법을 기억하지 못할 수도 있습니다. 그래서 위의 문제를 해결하기 위해 치트 시트가 탄생했습니다. 모든 구문, 개념을 체계적이고 직관적인 방식으로 합성하여 웹 개발 프로세스에 적용 할 내용을 쉽게 찾을 수 있습니다.


개발자용 치트 시트 OverAPI.com 


OverAPI.com은 Javascript, NodeJS, PHP, Python, CSS 등 널리 사용되는 많은 웹 프로그래밍 언어에 대한 치트 시트를 집계하는 웹 사이트입니다.


OverAPI.com 


Awesome-Cheatsheets 


Awesome-Cheatsheets는 Django Cheatsheet, Node.js Cheatsheet, Laravel Cheatsheet를 포함한 인기 있는 웹 프로그래밍 언어 치트 시트 모음이기도 합니다. ... 프론트 엔드 팀에는 The HTML5 Cheatsheet, Vue.js Cheatsheet, React.js Cheatsheet ... 메인 페이지를 참조 할 수 있습니다!


Awesome-Cheatsheets 


Bootstrap 4 Cheat Sheet 


Bootstrap 4 Cheat Sheet는 모든 기능을 집계하고 Bootstrap 버전 4.3.1의 구성 요소를 표시하는 사이트입니다. 클래스를 선택하기 만하면 해당 클래스에 대한 코드와 예제가 자동으로 표시됩니다. 또한 해당 코드를 프로그램에 빠르게 복사 할 수 있는 복사 기능도 있습니다.


Bootstrap 4 Cheat Sheet 


GitSheet 


GitSheet는 Git에서 자주 사용하는 명령의 집계 자입니다. 각 문에 대해 자세한 사용법을 설명합니다. 명령을 선택하고 복사 버튼을 누르기 만하면 자동으로 명령이 복사됩니다.


GitSheet 


HTML5 Element Index 


HTML5 요소 색인은 HTML5 버전에서 새롭거나 재정의 된 개체를 모아 놓은 웹 페이지입니다. 각 HTML5 개체에는 해당 기능을 완전히 설명하고 해당 개체와 관련된 추가 문서를 제공하여 더 잘 이해할 수 있는 콘텐츠가 있습니다. 또한 코드를 클릭하면 선택한 객체에 해당하는 예제 코드 스니펫이 표시됩니다. 웹 페이지의 HTML5 개체는 알파벳순으로 정렬됩니다!


HTML5 Element Index 


HTML CheatSheet 


HTML CheatSheet는 웹 개발을 위한 유용한 예제와 도구를 종합하여 색상 선택, 링크 생성, 이미지 생성, HTML 용 테이블 생성 등의 웹 개발 시간과 노력을 줄이는 데 도움이 되는 웹 사이트입니다. 또한 CSS, Javascript, Jquery, SEO와 같은 웹 프로그래밍의 다른 장르를 위한 도구가 있습니다. 메인 페이지에서 더 많은 것을 볼 수 있습니다!


HTML CheatSheet 


Can I Use 


Can I Use는 각기 다른 브라우저 버전에 대한 정보를 제공하는 웹 사이트로, 프로그래머가 해당 브라우저에 사용할 수 있는 웹 기술을 알 수 있도록 도와줍니다. 또한 Chrome, Firefox, IE와 같은 현재 널리 사용되는 브라우저에 대한 전체 정보가 있습니다. 또한 지원되는 기능은 지원되는 색상으로 표시되며, 빨간색은 지원되지 않음, 부분 지원은 진한 노란색, 지정되지 않은 지원은 회색으로 표시됩니다.

Can I Use 


Rico's cheatsheets 


Rico의 치트 시트는 React, Vue, ES6, Vim, Kotlin과 같은 웹 개발자를 위한 거의 완전한 집계 치트 시트입니다. 각 카테고리마다 원하는 치트 시트를 쉽게 찾을 수 있도록 여러 개의 작은 섹션으로 나뉩니다. 또한 Visual Studio Code, Atom, Sublime Text 등의 코드 편집기에 대한 일반적인 바로 가기 키를 찾을 수 있습니다.


Rico's cheatsheets 


Cheatography 


Cheatography는 또한 웹 개발을 위한 치트 시트 모음이며 Miscellaneous, Network, DevOps, Database, Programming Language ...와 같은 여러 하위 범주로 나뉩니다. 프로그래밍을 위한 치트 시트가 800 개 이상 있습니다. 검색 기능을 추가하고 여러 기준으로 필터링하여 적합한 치트 시트를 찾는 데 도움을 줍니다. 또한 소프트웨어, 교육, 마케팅, 게임에 대한 더 많은 치트 시트를 찾을 수 있습니다.


Cheatography 


CSS3 Animation Cheat Sheet 


CSS3 애니메이션 치트 시트는 웹 프로젝트를 위한 CSS3 애니메이션 모음입니다. animations.css 파일을 로드하고 HTML에서 개체에 대해 원하는 효과 클래스를 호출하기 만하면 됩니다. 효과를 보다 쉽게 ​​선택할 수 있도록 완전하고 상세한 예제가 제공됩니다. 더 많은 참조를 위해 데모 페이지에서 볼 수 있는 이 부분!

CSS3 Animation Cheat Sheet 


CSS Grid Cheat Sheet 


CSS Grid Cheat Sheet는 웹 페이지 용 CSS3를 사용하여 그리드 시스템을 쉽게 만들 수 있도록 도와주는 웹 사이트입니다. grid-template-columns, grid-template-rows, grid-column-gap 정의와 같은 전체 기능을 지원하는 도구를 사용하면 해당 속성에 대한 정보를 입력하기 만하면 웹 페이지에 자동으로 그리드 시스템이 표시됩니다. 보다 직관적 인 모양을 제공하고 이 그리드 시스템이 웹 사이트에 적합한 지 쉽게 확인할 수 있습니다.


CSS Grid Cheat Sheet 


Grid 


그리드는 웹 사이트에 대한 CSS3 그리드 시스템을 정의하는 데 사용되는 각 속성에 대한 전체 세부 예제를 모은 웹 페이지입니다. 예제를 클릭하면 코드가 자동으로 복사되고 사용할 프로그램에 붙여 넣기 만하면 됩니다.


Grid 


Easing functions 


Easing functions 


Media Queries Cheat Sheet 


Media Queries Cheat Sheet 


Responsive Web Design Cheat Sheet 


Responsive Web Design Cheat Sheet 


HTML5 Canvas Cheat Sheet 


HTML5 Canvas Cheat Sheet 



Web Developer's SEO Cheat Sheet 


Web Developer's SEO Cheat Sheet 

Modern JavaScript Cheatsheet 


Modern JavaScript Cheatsheet 


HTML5 Security Cheatsheet 


HTML5 Security Cheatsheet 

Html Vocabulary 


Html Vocabulary 


Regex Cheat Sheet 


Regex Cheat Sheet 


Developer cheatsheets 


Developer cheatsheets 


Vue Cheatsheet 


Vue Cheatsheet 

https://dev.to/haycuoilennao19/35-website-cheat-sheet-for-developer-22hk