/No-Code Development Agency

새로운 FlutterFlow 프로젝트를 어떻게 만드는지?

새로운 FlutterFlow 프로젝트를 만드는 쉬운 단계별 과정을 배우세요-웹 사이트 방문부터 계정 생성, 플랫폼 및 템플릿 선택, 프로젝트 게시까지.

Matt Graham, CEO of Rapid Developers

Book a call with an Expert

Starting a new venture? Need to upgrade your web or mobile app? RapidDev builds Bubble apps with your growth in mind.

Book a free No-Code consultation

새로운 FlutterFlow 프로젝트를 어떻게 만드는지?

1단계: FlutterFlow 웹사이트 방문

새로운 FlutterFlow 프로젝트를 만들기 위한 첫번째 단계는 FlutterFlow 웹사이트를 방문하는 것입니다. 선호하는 브라우저를 열고 주소 표시줄에 https://flutterflow.io/를 입력하고, Enter를 눌러주세요.

2단계: FlutterFlow 계정에 로그인

이미 FlutterFlow 계정이 있다면 FlutterFlow 홈페이지에 위치한 로그인 버튼을 클릭하세요. 계정 정보를 입력하고 로그인을 클릭하여 진행하세요.

FlutterFlow 계정이 없다면 로그인 버튼 옆에 위치한 회원가입 버튼을 클릭하여 쉽게 만들 수 있습니다. 계정을 만들기 위해 필요한 세부정보들을 제공하세요.

3단계: 새로운 프로젝트 생성

로그인이 완료되면 FlutterFlow 대시보드가 나타납니다. 이 페이지에는 여러분이 만든 FlutterFlow 프로젝트 전체를 보여줍니다. 새로운 프로젝트를 만들려면 페이지 중앙 또는 오른쪽 상단에 위치한 + 새 앱 생성 버튼을 클릭하세요.

4단계: 플랫폼 선택

팝업 창이 나타나며 프로젝트에 사용할 플랫폼을 선택하도록 요청합니다. iOS, Android, Both 중에서 하나를 선택할 수 있습니다. 선택한 플랫폼을 클릭하여 계속 진행하세요.

5단계: 프로젝트 이름 지정

플랫폼을 선택한 후 팝업 화면에 프로젝트의 이름을 입력하라는 텍스트 필드를 보여줍니다. 선호하는 이름을 입력하고 텍스트 필드 아래에 있는 앱 생성 버튼을 클릭하세요.

6단계: 템플릿 선택

새 페이지로 리다이렉트되어 프로젝트에 다양한 템플릿중에서 선택하거나 처음부터 시작할 수 있게 됩니다. 다양한 템플릿세로 스크롤하여 탐색하세요. 마음에 드는 템플릿이 있다면 클릭한 후 계속을 눌러주세요. 처음부터 시작하길 원한다면 빈 프로젝트 템플릿 선택 후 계속을 클릭하세요.

7단계: 프로젝트 커스터마이징

이전 단계에서 선택한 템플릿에 따라 프로젝트에는 이미 설계된 화면, 백엔드 구성 또는 통합 등 여러 섹션이 포함되어 있을 수 있습니다. 각 요소를 클릭하여 오른쪽 패널에서 해당 기능을 변경하여 여러분의 필요에 맞게 커스터마이징 할 수 있습니다.

8단계: 프로젝트 저장

커스터마이징에 만족한다면, 화면의 왼쪽 상단에 있는 파일 메뉴를 클릭한 후 저장을 클릭하여 프로젝트를 저장합니다.

9단계: 프로젝트 미리보기

화면의 오른쪽 상단에 위치한 미리보기 버튼을 클릭하세요. 이를 통해 브라우저의 새 탭에서 앱의 실시간 미리보기가 표시됩니다.

10단계: 프로젝트 게시

프로젝트에 만족하게 되면, 화면의 오른쪽 상단에 있는 게시 버튼을 클릭하세요. 프로젝트를 게시하는 동안 표시되는 안내를 따라주세요. 이제 새로운 FlutterFlow 프로젝트가 생성되었습니다!

기억하세요, 프로젝트 대시보드로 돌아와 언제든지 수정을 하거나 진행 상황을 검토하고 FlutterFlow 프로젝트의 사용자를 관리할 수 있습니다.

더 유용한 노코드 리소스 살펴보기

No-Code Tools Reviews

Delve into comprehensive reviews of top no-code tools to find the perfect platform for your development needs. Explore expert insights, user feedback, and detailed comparisons to make informed decisions and accelerate your no-code project development.

Explore

WeWeb Tutorials

Discover our comprehensive WeWeb tutorial directory tailored for all skill levels. Unlock the potential of no-code development with our detailed guides, walkthroughs, and practical tips designed to elevate your WeWeb projects.

Explore

No-Code Tools Comparison

Discover the best no-code tools for your projects with our detailed comparisons and side-by-side reviews. Evaluate features, usability, and performance across leading platforms to choose the tool that fits your development needs and enhances your productivity.

Explore

By clicking “Accept”, you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts. View our Privacy Policy for more information.

Cookie preferences