Flutter

npm install -g firebase-toolsfirebase loginfirebase init 위 명령어를 입력해 firebase-cli를 설치한다로그인 및 초기화를 해서 프로젝트, 기능을 초기화한다  이메일을 보낼때 nodemailer를 사용하기때문에 아래 명령어를 입력해서 설치한다cd functionsnpm install nodemailer 코드를 작성하기 이전에 메일을 보낼때 필요한 gmail계정을 준비한다.이 계정은 2차인증 까지 되어있어야하며, 앱 비밀번호를 생성해 그 비밀번호를 기억해놓아야한다. 앱 비밀번호 생성법은 아래 링크를 참고하면된다. [ETC] 구글 앱 비밀번호 발급 방법https://myaccount.google.com/u/3/apppasswords 로그인 - Google 계..

Riverpod Riverpod는 상태관리 라이브러리이다. 상태관리란 데이터를 효율적으로 관리하고, 위젯간에 데이터 공유를 효율적으로 하기위한 방법이다. 상태관리 라이브러리는 Riverpod 이외에 여러 종류가 있다. Getx Provider Bloc 위의 3가지 이외에도 더 있지만 종류가 많아 유명한 3개만 적었다. Riverpod은 위에 3가지 라이브러리 중 Provider를 개선한 버전이라고 한다. 무엇을 개선했는지는 이후에 정리를 한번 다시해볼수있도록할 예정이다. 나는 일단 들이박고 보기때문에 바로 핵심 기능부터 알아보고 사용해보았다. 사용해보면서 알아낸 신기한부분 지금까지 Getx만 사용하다가 Riverpod을 해보면서 신기했던점은 전역으로 provider를 선언하는점이었다. Provider P..

디자이너의 요구에 맞추다 보니 버튼에 그라데이션을 넣으라는 미션이 있었다. 편하게 InkWell로 처리하면 될것같지만 그렇지않다. 만약 컨테이너의 모서리가 둥글다면 InkWell은 둥글게 하지못하기때문에 어색하게 보이는 문제가보인다. 이를 해결하기위해서 나는 ElevatedButton을 사용하기로했다. ElevatedButton에 곧바로 적용을 할수는없었고 대신에 컨테이너를 밖에 감싸 배경색을 주고 ElevatedButton의 배경을 투명하게 만들어 적절한 효과를 줄수있었다. Container( width: width, height: height, decoration: BoxDecoration( gradient: LinearGradient(colors: [Color(0xffE73863), Color(0x..

더보기 GetX란 flutter에서 지원하는 상태 관리 라이브러리이다. 자세한 설명은 나중에 이 글에 추가할 예정이다. getX에서 추천하는 getx-patternd라는 이름의 패턴이 있다. 관련 사이트에서 이 패턴은 모듈형, 패키지형구조 2개로 만들어낼수있는것같다. 패키지형 구조 모듈형 구조 패키지 형은 UI폴더를 따로 두어 view역할을 하는 것 같고 모듈형은 modules에서 view역할과 controller 역할을 하는 것으로 보인다. 이번 포스팅은 패키지형 구조에 관해서 정리한다. 여기서 조금 더 정리하면 Data Model Provider Repository Controller UI Routes 위의 구조로 정리를 해야 한다는 점을 참고하고 아래 설명을 보자 각자 용어가 어디에 쓰이는지 알아보..

flutter 에서 Container는 개인적으로 많이쓰는 위젯이다. Container에서 테두리를 만드는 방법은 여러가지가 있다. 전체 테두리 : Border.all() 상하 / 좌우 테두리 : Border.symmetric(horizontal : ~~~, vertical : ~~~~~) 지정 테두리 : Border() 방법은 아래와 같다 //전체테두리 Container( width: 100, height: 100, decoration: BoxDecoration(border: Border.all(color: Colors.black, width: 1)), ); //지정 테두리 Container( width: 100, height: 100, decoration: BoxDecoration( border: B..

앱을 만들다보면 자연스럽게 무한 스크롤이 필요할때가 온다. 무한스크롤이 이걸말하는지는 모르겠지만 itemCount만 지정히지않는다면 무한정으로 나오긴한다. Pagenation 무한 스크롤과 관련된 글을 조만간 정리할 예정이다. 이부분은 참고만 하도록하자. GridView.builder( itemCount: data.length, //최대로 표시될 갯수 gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( crossAxisCount: 2, //한줄에 표시할 갯수 itemBuilder: (BuildContext context, int index) {//무한 스크롤에 들어갈 요소 return new Card( child: new GridTile( footer: ..