「본 사이트 최초 공개」온라인에서 실행하는 정적 HTML 도구 사이트
4,422 0
프런트엔드를 공부할 때 테스트 코드를 실행해야 하는 경우가 자주 있습니다. 당시에는 주로 Chinaz의 웹마스터 도구와 같은 온라인 도구를 사용했습니다. 이제 프런트엔드 기술을 어느 정도 익혔기에, 더 많은 사람들이 프런트엔드 프로그래밍을 더욱 편리하게 배울 수 있도록 직접 온라인 실행 도구를 만들어 보기로 했습니다. 아래는 도구의 시연 이미지입니다.

LOGO에 관하여: 현재 LOGO는 즉흥적으로 디자인한 것이라确실히 조금 못생겼습니다(웃음). 너그럽게 봐 주세요. 이후에 개선할 예정입니다.
온라인 도구의 특징
- 반응형 디자인
프런트엔드에는 Bootstrap 프레임워크를 사용하여 휴대폰, 태블릿, 컴퓨터에서 페이지가 모두 보기 좋게 표시됩니다. - 코드 실시간 실행
현대적인 프레임워크를 사용해 코드를 실행하므로 기존 도구처럼 페이지를 새로 고쳐 이동할 필요가 없습니다. - 코드 구문 강조 표시
코드 구문 강조 기능을 통합하여 학습과 디버깅을 더욱 편리하게 할 수 있습니다. - 오류 알림
코드 오류를 실시간으로 알려 주어 사용자가 문제를 빠르게 찾아 수정할 수 있도록 돕습니다.
스타일 및 기술 스택
- 페이지 스타일은 주로 Bootstrap 프레임워크를 사용하여 간결하고 확장하기 쉽습니다.
- 다양한 언어 코드의 구문 강조를 지원합니다(HTML, CSS, JavaScript).
- 오류 감지 기능에는 간단하고 효과적인 오류 보고 모듈이 통합되어 있습니다.
앞으로도 기능과 인터페이스를 계속 최적화할 예정이니, 많은 제안과 의견 부탁드립니다~
댓글
(0)아직 댓글이 없습니다