[코독하구만 2] 6주차 - Flutter : Shop App 3

https://codekodo.tistory.com/91 [코독하구만 2] 5주차 - Flutter : Shop App https://codekodo.tistory.com/88 [코독하구만 2] 4주차 - Flutter : Shop App Udemy 강의가 어느덧 50퍼를 넘겼다. 중간에 어려운 부분도 몇 개 있었지만 이제 어느정도 혼자서 구축할 수 있을 것 같다. 사실 그.. codekodo.tistory.com 지금까지는 Local에서 진행했는데 Firebase를 이용하여 Server에서 데이터를 가져오도록 코드를 수정했다. 우선 일종의 Controller 역할을 수행하는 Provider로 모든 데이터를 변경했다. 예를 들어 서버에 저장된 상품을 가져올 수 있도록 구현했다. import 'packag..

[코독하구만 2] 5주차 - Flutter : Shop App 2

https://codekodo.tistory.com/88 [코독하구만 2] 4주차 - Flutter : Shop App Udemy 강의가 어느덧 50퍼를 넘겼다. 중간에 어려운 부분도 몇 개 있었지만 이제 어느정도 혼자서 구축할 수 있을 것 같다. 사실 그때 그때 바로 정리하고 싶었는데 어쩌다보니 밀려서 오늘부터라 codekodo.tistory.com 지난 주에 일부 구현한 Shop App에 기능을 추가했다. GridView로 표현한 아이템을 클릭하면 해당 아이템의 상세 정보를 보여준다. import 'package:flutter/material.dart'; import '/providers/products.dart'; import 'package:provider/provider.dart'; class ..

[코독하구만 2] 5주차 결과

고도현 : https://codekodo.tistory.com/91 [코독하구만 2] 5주차 - Flutter : Shop App 2 https://codekodo.tistory.com/88 [코독하구만 2] 4주차 - Flutter : Shop App Udemy 강의가 어느덧 50퍼를 넘겼다. 중간에 어려운 부분도 몇 개 있었지만 이제 어느정도 혼자서 구축할 수 있을 것 같다. 사실 그.. codekodo.tistory.com 신희승 : https://ciwekdo.tistory.com/26 [2021모각코] 5회차 2021.08.05 Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자! 5회차 모각표 목표 검색 결과를 출력하는 ListView를 구성하자_2 package com..

[코독하구만 2] 4주차 결과

고도현 : https://codekodo.tistory.com/88 [코독하구만 2] 4주차 - Flutter : Shop App Udemy 강의가 어느덧 50퍼를 넘겼다. 중간에 어려운 부분도 몇 개 있었지만 이제 어느정도 혼자서 구축할 수 있을 것 같다. 사실 그때 그때 바로 정리하고 싶었는데 어쩌다보니 밀려서 오늘부터라 codekodo.tistory.com 신희승 : https://ciwekdo.tistory.com/25 [2021모각코] 4회차 2021.07.29 Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자! 4회차 모각표 검색 결과를 출력하는 ListView를 구성하자_1 package com.example.naversearch; import an.. ciwekdo..

[코독하구만 2] 4주차 - Flutter : Shop App 1

Udemy 강의가 어느덧 50퍼를 넘겼다. 중간에 어려운 부분도 몇 개 있었지만 이제 어느정도 혼자서 구축할 수 있을 것 같다. 사실 그때 그때 바로 정리하고 싶었는데 어쩌다보니 밀려서 오늘부터라도 바로바로 정리하는 시간을 가지려고 한다. Shop 어플은 우선 GridView 로 상품을 보여주고 상품별로 title 과 좋아요 , 장바구니담기 가 존재한다. 우선 이렇게 분리했다. models 에는 상품 에 대해 정의되어 있다. 아래가 product.dart 이다. 변수를 선언해주고 생성자까지 구현해주었다. class Product { final String id; final String title; final String description; final int price; final String imag..

[코독하구만 2] 3주차 결과

고도현 : https://codekodo.tistory.com/85 [코독하구만 2] 3주차 - Flutter : Personal Expense App 지난 주에 이어 Udemy 강의에서 만들어본 개인 가계부 어플을 리뷰해보려고 한다. 지난 주에는 미완성이였는데 강의를 독학하면서 다 완성했다. 뭔가 살짝 어설프지만 어느정도 혼자서 구현할 수 codekodo.tistory.com 신희승 : https://ciwekdo.tistory.com/24 [2021모각코] 3회차 2021.07.22 Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자! 3회차 모각표 Naver검색 어플리케이션 Ui수정 및 권한 지정 package com.example.naversearch; import andr..

[코독하구만 2] 3주차 - Flutter : Personal Expense App

지난 주에 이어 Udemy 강의에서 만들어본 개인 가계부 어플을 리뷰해보려고 한다. 지난 주에는 미완성이였는데 강의를 독학하면서 다 완성했다. 뭔가 살짝 어설프지만 어느정도 혼자서 구현할 수 있을 것 같다. 주말에 남은 50%의 강의를 다 듣고 혼자 만들어보면서 복습해보려고 한다. 아무튼 3주차 모각코 스타트! 우선 전체적인 UI는 아래와 같다. 소비 항목이 없는 경우 zZ의 이미지를 출력하며 상단에는 Chart를 확인할 수 있는 Switch와 새로운 소비 항목을 등록할 수 있는 Button이 AppBar의 우측과 Home의 하단에 존재한다. Switch를 On하면 오늘을 기준으로 지난 1주일 간의 소비금액이 출력된다. 글을 작성하고 있는 오늘은 목요일이므로 Thursday. 코드를 살펴보자. 다 지우고..

[코독하구만 2] 2주차 결과

고도현 : https://codekodo.tistory.com/79 [코독하구만 2] 2021.07.15(목) - Flutter : Personal Expense App Udemy 강의를 듣으면서 Flutter를 학습하고 있다. 이번 주는 Builder, Container, Column, Row, CrossAxisAlignment, ListView, Button 등을 활용하여 가계부 어플을 만들었다. 아니 만드는 중이다. 전체적인 구조.. codekodo.tistory.com 신희승 : https://ciwekdo.tistory.com/23 [2021모각코] 2회차 2021.07.15 Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자! 2회차 모각표 목표 네이버 검색 api를 이..

[코독하구만 2] 1주차 결과

고도현 : https://codekodo.tistory.com/76 [코독하구만 2] 1주차 - Flutter : Quiz App codekodo.tistory.com 신희승 : https://ciwekdo.tistory.com/22 [2021모각코] 1회차 2021.07.07 Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자! 1회차 모각표 목표 기본적인 Android Studio 사용법 학습 및 검색 앱 UI설계 sinheeseung/2021-Summer-Assemble-And-Selfcode (github.com) sinhee.. ciwekdo.tistory.com 최현석 : https://coderhs.tistory.com/11 7th Meet - 코독하구만 ( aws ,..

[코독하구만 2] 2주차 - Flutter : Personal Expense App

Udemy 강의를 듣으면서 Flutter를 학습하고 있다. 이번 주는 Builder, Container, Column, Row, CrossAxisAlignment, ListView, Button 등을 활용하여 가계부 어플을 만들었다. 아니 만드는 중이다. 전체적인 구조는 AppBar 우측 상단과 하단에 기록을 추가할 수 있는 버튼이 있고 버튼을 클릭하면 새로운 소비항목을 등록할 수 있다. 또한 AppBar 아래에는 1주일 간의 소비 금액을 한 눈에 확인할 수 있는 차트를 구현하고 있다. 이번 어플의 전체적인 위젯 트리 구조는 아래와 같다. assets 폴더에는 어플에서 사용할 폰트와 이미지가 저장되어있다. models에는 소비항목과 관련된 변수가 선언되어있고, widgets에는 소비항목을 UI에 표시할 ..

2. Stateless, Stateful

플러터의 위젯은 크게 두 가지로 나뉜다. Stateful과 Stateless Stateful은 위젯이 동작하는 동안 내부 클래스에서 데이터 변경이 필요한 경우에 사용된다. setState 실행 이후 화면을 다시 그려서 변경된 부분을 다시 반영한다. Stateless는 Stateful과 다르게 위젯이 동작하는 동안 데이터 변경이 일어나지 않는 경우에 사용된다. 사용자의 반응과 상관 없이 화면만 보여줄 때 사용한다고 생각하면 된다. import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) ..

1. Widget

플러터는 위젯으로 시작해서 위젯으로 끝난다. 플러터로 앱을 개발할 때 화면상에 보이는 모든 것(element들의 배치)과 padding, margin과 같은 보이지 않는 것들이 위젯이다. 이러한 Widget간의 관계를 Widget Tree라고 한다. Widget들은 부모와 자식의 관계를 갖는다. MyApp의 자식으로 MaterialApp이 존재한다. Material은 현재 안드로이드에 적용된 UI이다. https://flutter.dev/docs/development/ui/widgets/material Material Components widgets flutter.dev 이와 대비되는 것은 Cuppertino, 현재 IOS에 적용된 UI이다. https://flutter.dev/docs/developm..

[코독하구만 2] 1주차 - Flutter : Quiz App

오늘부터 Flutter를 공부하려고 한다. 원래는 Spring 공부를 하려고 했는데 이번에 지란지교소프트에서 인턴을 진행하는데 여기서 Flutter를 사용해서 앱을 개발하는 공부를 진행하고 있어서 Flutter를 따로 공부해야했다. Flutter와 Spring을 동시에 공부하기엔 시간이 너무 부족해서 그냥 Flutter에 집중하려고 한다. 일단 강의는 Udemy 강의를 수강하고 있는데 영어 강의라 자막을 켜두고 하는데도 살짝 빡세다. 왜 한국 강의를 수강하지 않았냐고 물어본다면 국내 강의 중에 Flutter 강의가 괜찮은게 없다고 생각했기 때문이다. 또한 인프런에 몇 개 강의가 있는데 너무 비쌌다. Udemy에선 고작 14000원... 강의 시간 역시 42시간으로 상당했고 커리큘럼 역시 마음에 들었다. ..

[패스트캠퍼스 서포터즈 3기 - Node.js 강의 후기] 5주차 : 강의 후기

본 게시글은 PC버전에 최적화 되어있으며 패스트캠퍼스 서포터즈 3기로 활동하며 "한 번에 끝내는 Node.js 웹 프로그래밍 초격차 패키지 Online"을 무료로 협찬받아 작성한 게시글입니다. 드디어 길고 긴 한 달이 끝났다. 이게 시기가 기말고사 기간하고 겹쳐서 강의를 제대로 듣지는 못한 듯 싶다. 최근 비전공자 개발자가 많아지고 있는데 그런 분위기에 알맞은 강의라고 생각한다. 본인도 전공자이지만 웹쪽으로는 기본적인 js문법만 알고 있고 깊게 배운 적이 없다. 현재 학교 강의 중에 1~2주 간격으로 다양한 프레임워크를 배우는 과목이 있는데 거기서 리액트를 처음 접했었다. 하지만 2번의 강의에서 많은 양의 정보를 얻기란 쉽지 않았다. 그 때 배우지 못한 부분들을 이번 Node.js 강의를 통해 추가적으로..

[패스트캠퍼스 서포터즈 3기 - Node.js 강의 후기] 4주차 : 바벨과 JSX, 웹팩 (풀스택개발자)

본 게시글은 PC버전에 최적화 되어있으며 패스트캠퍼스 서포터즈 3기로 활동하며 "한 번에 끝내는 Node.js 웹 프로그래밍 초격차 패키지 Online"을 무료로 협찬받아 작성한 게시글입니다. 풀스택개발자 풀스택개발자 풀스택개발자 풀스택개발자 풀스택개발자 벌써 4주차다. 이제 한 주만 더하면 서포터즈 활동은 끝... 이번 주에 하나 쓰고 다음 주에 마지막 5주차를 쓸라했는데 이번주 수요일까지 5주차를 마무리하라고 하셔서 오늘 하나... 내일 하나... 이렇게 써야된다😂😂 오늘은 지난 주 리액트 맛보기에 이은 바벨과 JSX, 웹팩에 대해서 학습했다. 일단 JSX가 뭐냐고? HTML처럼 생긴 문법이다. const element = Hello, world!; 뭔가 짬뽕됐다. HTML 태그인데 const형 변수..