본문 바로가기

flutter6

[Flutter X Firebase] 2 시간만에 만드는 채팅앱 만들기 ChatApp flutter과 Firebase를 활용하여 채팅앱을 구현했습니다. 크로스 플랫폼인 flutter로 작성하여 ios, 안드로이드 모두 구현 가능합니다. mac사용자라면 xcode에서 ios시뮬레이터를 다운로드 후 사용하시면 되고(물론 안드로이드도 상관 없습니다) Windows사용자라면 AndroidStudio의 시뮬레이터를 사용하시면 되겠습니다. 저는 mac를 사용하여 구현했습니다. IDE는 VSCode를 사용했습니다. 앱 스타일은 안드로이드, ios모두 적용가능한 MaterialApp 스타일로 만들었습니다.(ios는 Cupertion 스타일로 도전하는 것도 좋습니다!) ios 버전은 17.2 데이터베이스는 FIrebase를 사용했습니다. 사용자인증, 데이터 스토리지를 사용했습니다. (어래글 참고) 유튜브.. 2024. 2. 20.
[Firebase X Flutter] 사용자 인증 auth 사용하기 Firebase는 간단하게 사용자 정보를 가져와 인증을 진행할 수 있습니다. 우선 FIrebase에 로그인 한 후 Authentication으로 들어옵니다. 테스트를 위한 사용자를 추가합니다. 저는 test5@gmail.com을 추가했습니다. FIrebase는 복잡한 절차없이 이렇게 간단하게 사용자를 추가 할 수 있습니다. 그럼 이제 Flutter에서 간단하게 활용해보도록 하겠습니다. FIrebase에서 플러그인 설치를 진행합니다. 플러그인을 설치했으면 pubspec.yaml 파일에 플러그인이 올바르게 설치되었는지 확인합니다. firebase_auth가 표시된다면 올바르게 설치된 것입니다. 이제 사용자 인증을 활용하는 코드를 통해 어떻게 사용하는지 감을 잡아 보겠습니다. 아래 코드는 FirebaseAut.. 2024. 2. 20.
Flutter 5. ToDo 앱 만들기. (5) 검색 메소드 구현하기. Flutter로 간단한 ToDo앱을 만들어보는 프로젝트입니다. 처음 시작화면 구성부터 내용 추가, 삭제, 검색 기능을 메소드로 구현해 보겠습니다. 이 편은 스플래시 시작화면 구성하는 방법을 설명합니다. 이 프로젝트는 macOS 에서 VScode를 사용했스며, iPhone 14 Pro Max 시뮬레이터를 사용했습니다. github : https://github.com/tjdwns4712/flutterToDoApp 깃허브에서 프로젝트 전체 소스코드를 확인할 수 있습니다. 중요한 내용만을 요약했기에 전체 코드를 읽으며 이해하는 것을 추천합니다. 이 글은 앞선 ToDo프로젝트 설명과 이어집니다. https://miacoder.tistory.com/5 Flutter 4. ToDo 앱 만들기. (4) 추가, 삭제,.. 2023. 6. 9.
Flutter 3. ToDo 앱 만들기. (3) Json 형식을 이용해 정보 저장하기. Flutter로 간단한 ToDo앱을 만들어보는 프로젝트입니다. 처음 시작화면 구성부터 내용 추가, 삭제, 검색 기능을 메소드로 구현해 보겠습니다. 이 편은 스플래시 시작화면 구성하는 방법을 설명합니다. 이 프로젝트는 macOS 에서 VScode를 사용했스며, iPhone 14 Pro Max 시뮬레이터를 사용했습니다. github : https://github.com/tjdwns4712/flutterToDoApp 깃허브에서 프로젝트 전체 소스코드를 확인할 수 있습니다. https://miacoder.tistory.com/3 Flutter 2. ToDo 앱 만들기. (2) 바텀바를 통해 여러 페이지 구현하기. Flutter로 간단한 ToDo앱을 만들어보는 프로젝트입니다. 처음 시작화면 구성부터 내용 추가, .. 2023. 6. 7.
Flutter 2. ToDo 앱 만들기. (2) 바텀바를 통해 여러 페이지 구현하기. Flutter로 간단한 ToDo앱을 만들어보는 프로젝트입니다. 처음 시작화면 구성부터 내용 추가, 삭제, 검색 기능을 메소드로 구현해 보겠습니다. 이 편은 스플래시 시작화면 구성하는 방법을 설명합니다. 이 프로젝트는 macOS 에서 VScode를 사용했스며, iPhone 14 Pro Max 시뮬레이터를 사용했습니다. github : https://github.com/tjdwns4712/flutterToDoApp 깃허브에서 프로젝트 전체 소스코드를 확인할 수 있습니다. ToDo를 전체적으로 만들고 싶으시다면, 1편을 보고 오시는 것을 추천드립니다. https://miacoder.tistory.com/2 Flutter 1. ToDo 앱 만들기. (1) 스플래시 시작화면 구성하기. Flutter로 간단한 To.. 2023. 6. 3.
Flutter 1. ToDo 앱 만들기. (1) 스플래시 시작화면 구성하기. Flutter로 간단한 ToDo앱을 만들어보는 프로젝트입니다. 처음 시작화면 구성부터 내용 추가, 삭제, 검색 기능을 메소드로 구현해 보겠습니다. 이 편은 스플래시 시작화면 구성하는 방법을 설명합니다. 이 프로젝트는 macOS 에서 VScode를 사용했스며, iPhone 14 Pro Max 시뮬레이터를 사용했습니다. github : https://github.com/tjdwns4712/flutterToDoApp 깃허브에서 프로젝트 전체 소스코드를 확인할 수 있습니다. 1. 스플래시란? 앱을 시작할 때 나타나는 화면으로 주로 앱의 로고를 보여주는 형태로 나타납니다. 앱을 실핼할 때 발생하는 로딩시간동안 보여주는 화면이기도 합니다. 아래와 같이 구현됩니다. 2. main.dart void main() { r.. 2023. 6. 2.