프로그래밍/Flutter

노마드 코더 Dart 시작하기 영상을 보고 정리한 내용입니다.https://nomadcoders.co/dart-for-beginners/lectures/4124 All Courses – 노마드 코더 Nomad Coders초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요!nomadcoders.co      환경 : VSCodeUbuntu에서 VSCode 설치https://code.visualstudio.com/download Download Visual Studio Code - Mac, Linux, WindowsVisual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Vi..

프로그래밍/Flutter

플러터에서 카카오 로그인을 구현하는 방법 입니다! 먼저 pubspec.yaml 파일을 열어서, dependencies에 kakao_flutter_sdk 패키지를 입력하고 저장해주세요. 카카오 로그인을 구현하려면, 카카오 개발자페이지에서 앱을 등록해줘야 합니다. https://developers.kakao.com/console/app 카카오계정 로그인 여기를 눌러 링크를 확인하세요. accounts.kakao.com 카카오 로그인을 사용할 애플리케이션 요약 정보에 들어가서, 네이티브 앱 키를 복사해오시구요, 아래 보이는 "플랫폼"에서 Android, iOS 패키지명을 입력해주세요! 메인 페이지에서 네이티브 앱 키를 입력해주고, 카카오로그인 페이지를 불러오도록 합니다. import 'package:findm..

프로그래밍/Flutter

앱바 테마 변경에 대한 설명은 아래 페이지에 자세히 나와있다. codelabs.developers.google.com/codelabs/first-flutter-app-pt2/#6 Write Your First Flutter App, part 2 | Google Codelabs Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase. In this codelab, you’ll extend a simple mobile app to add interactivity, navigation, and change its them..

프로그래밍/Flutter

튜토리얼4에 이어서 진행하도록 한다. 아래의 페이지에서 하트 기능 추가에 대한 설명을 볼 수 있다. 4. Add icons to the list 부터 보면 된다! codelabs.developers.google.com/codelabs/first-flutter-app-pt2/#3 Write Your First Flutter App, part 2 | Google Codelabs Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase. In this codelab, you’ll extend a simple mobile a..

프로그래밍/Flutter

튜토리얼3에서 임포트했던 english_words 라이브러리를 이용해 무한스크롤 리스트뷰를 만들어보도록 한다. 무한스크롤 리스트뷰 만드는 방법은 튜토리얼3에서 보던 flutter.dev/docs/get-started/codelab 페이지에서 알려주고있다. flutter.dev/docs/get-started/codelab Write your first Flutter app, part 1 How to write a web-based app in Flutter. flutter.dev 무한스크롤로 english_words에서 영단어를 출력해 보여주기 위해 RandomWordsState를 클래스로 만들어 랜덤 영단어를 리턴하도록 한다. 그리고서 RandomWordsState 클래스 안에 변수를 선언하는데, 변수 ..

프로그래밍/Flutter

아래의 플러터 페이지에 예제 코드가 있다. flutter.dev/docs/get-started/codelab Write your first Flutter app, part 1 How to write a web-based app in Flutter. flutter.dev Step 2: Use an external package에 보면 pubspec.yaml에 dependency를 추가하라고 써있다. pubspec.yaml 파일에 dependencies 아래에다가 english_words: ^4.0.0-0를 추가한다, 그리고 mail.dart파일에 아래와 같이 english_words를 임포트한다. main.dart의 MyApp클래스에다가 final wordPair = WordPair.random();을 추..

프로그래밍/Flutter

VSCode의 상단 메뉴바에서 View > Command Palette 를 클릭, Flutter: New Application Project 클릭, 프로젝트 폴더명을 입력하여 프로젝트 폴더를 생성한다. 프로젝트를 저장하는 경로 도중에 한글이 있으면 에러가 발생하므로 주의해야 한다. 프로젝트를 생성하면 아래와 같이 폴더와 파일들이 자동으로 생성된다. 주로 코딩할 곳은 android, ios, lib 세가지이고, lib > main.dart가 메인 개발소스코드 파일이다. dependency 를 추가하는 파일은 pubspec.yaml이다. main.dart에는 이미 코딩이 살짝 되어있는데, 다 지우고서 아래 페이지에 있는 튜토리얼 코드를 복붙한다. flutter.dev/docs/get-started/codel..

프로그래밍/Flutter

아래 링크에 들어가서 본인 운영체제에 맞는 것을 설치한다 나는 윈도우로 설치했다 flutter.dev/docs/get-started/install/windows Windows install How to install on Windows. flutter.dev 여기서 SDK 압축파일을 다운받는다 받은 압축파일을 풀면 flutter 폴더가 생성된다. 플러터 설치페이지에는 flutter를 C:\ProgramFiles\에는 설치하지 말라고 되어있다. ( 권한문제때문에 ) bin에는 flutter 실행파일이 존재하므로 bin폴더를 path에 추가해준다. 시작을 눌러서 환경 변수를 검색하고 시스템 환경 변수 편집 > 환경 변수에 들어간다. 사용자 변수에서 변수 Path를 더블클릭하면 나오는 환경 변수 편집에서 새로..