JavaScript 에디터: React JS TS

Android 휴대폰에서 JavaScript, TypeScript, React를 작성하세요. 실시간 미리보기, npm 패키지, 다중 파일 프로젝트를 지원하는 실제 코드 에디터로, 탭 한 번으로 작업을 웹에 게시할 수 있습니다.

JavaScript Editor는 웹 개발자, 학생, 면접 준비생을 위한 모바일 개발 환경입니다. 에디터, 콘솔, React 미리보기가 모두 기기에서 실행됩니다.

주요 기능

• JavaScript를 작성하고 콘솔 출력(로그, 경고, 오류)과 함께 인라인으로 실행

• JSX로 React 컴포넌트를 작성하고 기기에서 실시간 미리보기가 렌더링되는 것을 확인

• TypeScript 및 TSX를 작성하고 코드가 실행되기 전에 타입이 자동으로 제거되도록 설정

• 프로젝트를 여러 파일과 폴더로 분할하고 서로 간에 가져오기(import)

• 일반 import 문으로 npm 패키지를 가져오기

• 프로젝트를 모든 브라우저에서 열고 누구에게나 보낼 수 있는 링크로 게시

• 기기 어디에서든 .js, .jsx, .ts, .tsx 파일을 열고 저장

다중 파일 프로젝트

실제 앱은 단일 파일로 구성되지 않습니다. 컴포넌트와 폴더를 추가하고, 일반적인 상대 경로를 사용하여 서로 가져오기하며, 휴대폰 화면에 맞게 제작된 탭 스트립에서 파일을 전환하세요. 실행을 탭하면 진입 파일이 자동으로 마운트됩니다.

TypeScript

TypeScript를 켜고 인터페이스, 제네릭, 타입이 지정된 props를 사용하여 .ts 및 .tsx 파일을 작성하세요. 타입은 실행 전에 제거되므로, 실행을 탭하는 즉시 코드가 실행됩니다.

npm 패키지

이름으로 패키지를 가져오면 실행 시 해결됩니다. 터미널, 설치 단계, 구성 파일이 필요 없습니다. UI 라이브러리, 날짜 헬퍼 또는 애니메이션 패키지를 가져와 즉시 사용하세요.

웹에 게시

모든 프로젝트를 링크로 전환하세요. 다중 파일 가져오기, npm 패키지, TypeScript가 앱에서 실행되는 방식 그대로 모두 포함됩니다. 코드를 변경하고 다시 게시해도 링크는 동일하게 유지되며 새 버전을 표시합니다. 원할 때 언제든지 페이지를 내릴 수 있습니다.

코드 에디터

구문 강조, 자동 줄 바꿈, 찾기 어려울 수 있는 구두점용 기호 바, React hooks 단축키 바, 찾기 및 바꾸기, 깊이 있는 실행 취소 기록을 제공합니다. 작은 화면을 위한 고정폭 서체, 조절 가능한 글꼴 크기 및 들여쓰기 너비, 다양한 다크 에디터 테마를 지원합니다.

JavaScript 콘솔 및 디버깅

모든 스니펫을 실행하고 에디터 아래의 콘솔을 확인하세요. 로그, 정보, 경고, 오류에 대한 색상 코드 레벨, 타임스탬프, 탭 한 번으로 지우기 기능을 제공합니다. 오류는 발생한 위치에 표시되므로, 문제가 발생한 줄을 찾아 수정할 수 있습니다.

React 미리보기

실행을 탭하면 컴포넌트가 에디터 아래의 실시간 미리보기 창에 마운트됩니다. 탭 한 번으로 CSS를 편집하세요. 전체 화면으로 전환하여 전체 화면에서 결과를 검사할 수 있습니다.

예제 갤러리

엄선된 JavaScript 및 React 예제 — 배열 및 반복, async 및 await, 클로저, 클래스, fetch, hooks, state, 동적 목록, 폼 및 시각 효과. 탭으로 JavaScript 또는 React별로 필터링할 수 있습니다.

저장, 열기 및 내보내기

시스템 대화 상자를 통해 앱 또는 기기에 저장하세요. 휴대폰에서 기존 파일을 바로 열 수 있으며, 확장자가 올바른 모드를 선택합니다. 프로젝트를 모든 브라우저에서 실행되는 독립형 HTML 파일로 내보낼 수 있습니다.

대상 사용자

• 노트북 없이 컴포넌트를 스케치하는 웹 개발자

• JavaScript, TypeScript, React 또는 DOM을 학습하는 학생

• 실제 JavaScript로 알고리즘을 연습하는 면접 준비생

• 휴대폰으로 튜토리얼을 따라하는 독학 코더

• 실제 작업을 저장하는 모바일 JavaScript 플레이그라운드를 원하는 모든 사용자

Pro 업그레이드 가능

에디터, 콘솔, React 미리보기, 예제 갤러리는 무료로 사용할 수 있습니다. Pro 업그레이드는 광고를 제거하고 다중 파일 프로젝트, TypeScript, 게시, 에디터 테마, 사용자 지정 스니펫, 찾기 및 바꾸기, 탭 한 번으로 서식 지정 기능을 제공합니다.

지원 언어

영어, 스페인어, 포르투갈어, 프랑스어, 독일어, 러시아어, 힌디어, 벵골어, 인도네시아어, 터키어, 우르두어, 아랍어, 소말리어, 중국어(간체), 일본어, 한국어를 포함한 16개 언어로 제공됩니다.