구독자 여러분, Replit은 방금 Agent 4를 출시했고 저는 주말에 조기 접속을 했습니다. 이 튜토리얼에서는 Agent 4의 새로운 무한 캔버스 및 병렬 에이전트를 사용하여 실시간으로 습관 추적 앱을 계획, 설계 및 구축하는 방법을 보여 드리겠습니다. 또한 단 10분 만에 코드에서 프레젠테이션과 애니메이션을 생성하는 방법도 보여 드리겠습니다. 지금 YouTube에서 시청하거나 아래 서면 가이드를 읽어보세요. 타임스탬프:(00:00) Replit Agent 4의 세 가지 새로운 기능(00:34) 1단계: 무한 캔버스를 사용하여 습관 추적기 앱 설계(03:39) 2단계: 병렬 에이전트를 사용하여 더 빠르게 구축(05:52) 3단계: 한 번의 클릭으로 전체 스택 앱 게시(07:11) 4단계: 다음에서 슬라이드 데크 및 애니메이션 생성 code(08:58) 솔직한 의견: Replit이 AI 코딩 시장에 적합한 곳 우리가 만들 것 저는 항상 달력에서 습관을 확인하고 동기를 유지하기 위해 연속 기록을 추적할 수 있는 앱을 원했습니다. 이제 빌드해 보겠습니다. 1. 캔버스로 습관 추적 앱 디자인하기 다음 메시지로 Replit의 새로운 무한 캔버스를 시험해 보겠습니다. 모바일 습관 추적기 앱을 구축하세요(최대 3개의 습관). 두 개의 탭: 달력(기본) 및 습관(생성/편집). 달력 탭: 월별 보기. 습관이 완료됨에 따라 채워지는 각 날짜 링에 진행 상황을 표시합니다. 날짜를 탭하면 각 습관에 대한 토글 카드가 포함된 하단 시트가 열립니다. 습관 탭: 습관을 만들고 편집합니다. 이름 필드, 색상 지정. 깨끗하고 최소한입니다. 캔버스의 달력 탭에 대한 4가지 디자인 변형을 탐색하는 것부터 시작하겠습니다. Glassmorphic — 어둡고 반투명 유리 카드, 부드러운 빛, 프리미엄 느낌RPG Quest — 픽셀 아트, XP 바, 줄무늬 불꽃, gamifiedBotanical — 살아있는 정원 비유, 줄무늬가 식물을 키우고 조용하고 흙빛입니다. 제가 Replit에 네 가지 다른 디자인을 생성하도록 요청한 방법을 참고하세요. 뒤에서는 4개의 별도 에이전트를 가동하여 작업을 수행합니다. 내 습관 추적 앱을 위한 Glassmorphic, RPG 및 식물 디자인이 생성된 처음 세 가지 디자인은 다음과 같습니다. 저는 본질적으로 게이머이기 때문에 RPG 퀘스트 디자인을 사용하겠습니다. 이제 캔버스를 사용하여 시각적으로 디자인을 편집해 보겠습니다. 다음을 수행할 수 있습니다. 추가 화면을 생성합니다. RPG 디자인의 + 버튼을 누르고 "퀘스트 화면 생성"을 요청합니다. 정확한 편집을 수행합니다. 검사 아이콘을 클릭하고 텍스트나 색상을 수동으로 변경합니다. 이제 마음에 드는 달력과 퀘스트 보기가 있으므로 Replit를 사용하여 이를 구축해 보겠습니다.2. 병렬 에이전트로 더 빠르게 구축한 번에 하나의 에이전트로 구축하는 대신 두 개의 에이전트가 병렬로 작업하도록 합시다. 이제 Replit에서는 별도의 스레드를 스핀업하여 앱의 다른 부분에서 작업할 수 있습니다. 각 상담원에게 제공한 프롬프트는 다음과 같습니다. 달력 보기: 월별 보기를 작성하고, 스와이프하여 월 사이를 스크롤하면 오늘이 강조 표시됩니다. 날짜 셀에는 습관이 완료됨에 따라 채워지는 진행 링이 표시됩니다(1/3, 2/3, 3/3). 날짜를 탭하면 3가지 습관을 켜거나 끌 수 있는 하단 트레이가 표시됩니다.습관 보기: 이름과 색상이 포함된 최대 3개의 습관을 만들고 편집합니다. 각 습관에는 현재 연속 횟수가 표시됩니다. 습관을 편집하면 연속 횟수가 0으로 재설정됩니다. 두 개의 스레드를 시작한 후 이제 편안히 앉아 에이전트가 작업하는 것을 볼 수 있습니다. 작업이 초안, 활성 및 준비의 세 단계를 통해 이동하는 것을 볼 수 있는 멋진 Trello 스타일 보드 보기가 있습니다. 초안은 승인을 기다리는 계획이고, 활성은 에이전트가 작성 중임을 의미하며, 준비는 작업이 완료되어 검토할 준비가 되었음을 의미합니다. 이것이 AI 코딩 에이전트가 향하는 방향이라고 생각합니다. 하나의 에이전트와 페어 프로그래밍하는 대신 에이전트 팀을 관리합니다. 지침을 제공하고 자리를 비운 다음 다시 돌아와 작업을 검토합니다. 상담원이 완료되면 각 작업을 검토하고 "기본 버전에 변경 사항 적용"을 클릭하여 병합할 수 있습니다. 배송되는 항목은 여전히 ​​사용자가 제어할 수 있습니다. 문제가 있는 경우 병합하기 전에 수정을 요청할 수 있습니다. 앱이 빌드되면 게시를 눌러 한 번의 클릭으로 배포할 수 있습니다. Replit의 한 가지 장점은 프런트엔드, 백엔드, 데이터베이스 및 보안 검색이 모두 내장되어 수직적으로 통합되어 있다는 것입니다.3. 코드를 사용하여 슬라이드 데크 및 애니메이션 생성이 튜토리얼을 위해 Replit가 생성한 슬라이드 데크이제 좀 더 재미있게 놀아 보겠습니다. 최근에 저는 다음과 같은 사실을 깨달았습니다. 코드는 모든 지식 작업의 기초입니다. 코드를 사용하면 앱뿐만 아니라 슬라이드 데크, 애니메이션, 문서 등도 생성할 수 있습니다. 예를 들어, 저는 이 전체 뉴스레터 게시물을 Replit에 붙여넣고 다음 자산을 생성했습니다: 슬라이드 데크. 에이전트는 에이전트 4를 사용하여 계획을 세우는 방법을 다루는 10개의 슬라이드를 생성했습니다.습관 추적기를 디자인하고 구축합니다. 생기. 에이전트는 사용자 정의 그래픽 등을 갖춘 아름다운 애니메이션을 생성했습니다. 슬라이드, 애니메이션, 문서는 모두 내부적으로는 코드일 뿐입니다. 에이전트가 코드를 작성하고 반복할 수 있다면 거의 모든 지식 아티팩트를 생성할 수 있습니다. 솔직한 의견: Replit의 Agent 4가 AI 코딩 시장에 적합한 곳 AI 코딩 시장은 전문 개발자를 위한 도구와 다른 모든 사람을 위한 도구라는 두 부분으로 나뉘어 있다고 생각합니다. 개발자에게는 Claude Code와 OpenAI Codex 사이의 두 마리 경주가 있다고 생각합니다. 이러한 도구는 강력하고 빠르며 모델 및 개발자 워크플로에 깊이 통합되어 있습니다. 다른 모든 사람을 위해(그리고 이것이 더 큰 시장임) Replit는 Agent 4를 통해 두 가지 베팅을 하고 있습니다. 기술에 익숙하지 않은 사람들이 AI 에이전트와 직접 협업할 것입니다. 디자이너는 AI를 사용하여 수동으로 작업하는 대신 캔버스에 디자인을 생성합니다. PM은 작업을 완료하기 위해 Trello 스타일 보드를 통해 에이전트를 관리합니다. 코드는 지식 작업의 기초입니다. 에이전트가 코드를 작성할 수 있으면 앱, 프레젠테이션, 애니메이션 등을 생성할 수 있습니다. 얼마나 많은 사람들이 Microsoft Office, Google Workspace, 기존 디자인 또는 애니메이션 도구를 사용하는지 생각해 보세요. 그것이 Replit이 쫓고 있는 시장입니다. 저는 Agent 4가 두 가지 측면 모두에서 진정한 발전을 이룬다고 생각합니다. 캔버스에 좀 더 광택을 더할 수도 있지만 방향은 분명합니다. 우리는 AI 에이전트와 협력하여 미래에 앱뿐만 아니라 모든 종류의 것들을 구축할 것입니다. 제 튜토리얼을 보고 실제로 작동하는 모습을 보고 Agent 4를 직접 사용해 보세요.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free