일반인의 Flutter 앱개발 1. Dart(코딩기초, 변수, 함수, 세미콜론)

아니 이거 왜 배우려고?

안녕하세요 앱 개발을 하고 싶어서 무작정 플러터를 배우기로 했습니다.

평생 개발과 관련없는 직장만 다녔지만 만들고 싶은 앱이 생겨서 뛰어들었는데

역시 만만치는 않네요.

공부한 내용 기록할 겸 무작정 뛰어든 사람은 어떤 생각을 갖고 궁금해하는지에 대해

풀어나가며 해볼 예정입니다.

저 같은 사람이 또 있을 수 있기에 제 발자취를 보신다면 시행착오를 줄일 수 있지 않을까 하는 생각입니다.

그리고 전 개발자가 아니기에 제가 쓰는 용어들이 개발자들이 보기에 어색할 수 있으니 언제든지 댓글로 알려주면

감사하며 배워 나가겠습니다.

 

왜 Flutter를 선택했어?

 

Flutter를 배우면 ios와 android에 모두 등록할 수 있다는 장점이 있다는 단순하고도 위대한(?) 이유로 선택했습니다.

ios와 android는 각각의 고유 언어가 있는데 이를 Native라고 하는것 같았고 각각의 플랫폼으로 개발하는 것보다 플러터를 사용하면 60%의 비용을 줄일 수 있다고 합니다. 

물론 해당 운영체제와 완벽하게 호환하여 작동하는 것은 네이티브겠지만 제가 구현하려는 앱은 단순한 기능만 있으면 되기에 플러터로도 충분하지 않을까 하고 사실 게으름이 가장 큰 이유 생각합니다.

많은 분들이 react native와 Flutter중에 선택해서 하라고 하셨기에 저도 고민을 해봤는데 트렌드가 Flutter로 가는 것 같아

귀가 얇은 유행에 민감한 저로써는 Flutter를 하지 않을 수가 없었습니다.

그리고 유명한 글로벌 기업도 쓴다고 하니 아무 생각이 없는 저는 그냥 무작정 이 길을 가려고 선택했습니다.

BMW 등 다양한 글로벌 기업도 쓰는 Flutter (출처 : http://flutter.dev/)

언젠가는 이런 멋진 어플을 만드리라 다짐하며 도전해봅니다. (내 기준 멋진 어플 = 이쁜 그래픽)

그래 알겠고 Flutter가 뭔데?

플러터는 UI framework라고 하는데 UI는 유저 인터페이스일 테고 framework는 대체 뭔 말인가?

일반인들이 처음 배울 때 진입장벽인 용어의 장벽에 부딪혔습니다. 수없이 많은 처음 듣는 용어들이 난무합니다.

이걸 하나하나 이겨내야 우리는 개발자가 될 수 있습니다. 영어도 단어를 외워야 하듯 개발자도 컴퓨터 언어를 구사하는 사람이기에 이쪽 용어들을 알아야 우리와 다른 종족인 개발자들과 의사소통이 됩니다 ㅠ

 

framework는 목적을 가진 종합 패키지로 이해가 되었습니다.

플러터는 시각적이고 직관적인 애플리케이션을 양대산맥 운영체제(ios, Android)에 올리기 위해 필요한 것들(라이브러리, 컴파일러, API, 지원 프로그램 등)을 한대 모아놓은 놈? 정도로 이해를 하기로 스스로와 약속하고 넘어갔습니다 ^^

 

그래서 플러터를 쓰려면 플러터에서 사용하는 언어를 알아야 하는데 이놈이 DART라고 구글에서 쓰는 언어다? (맞나요)

그래서 dart를 사용하여 코딩을 하는 것을 배워보자 이 말입니다.

 

DART 입문

내가 개발자였다니????

다트의 시작은 유튜브 더코딩파파의 채널을 따라 하며 공부를 해보겠습니다. 영상강의는 해당 채널을 방문하시어 보시면 도움이 될 수 있습니다.

http://dart.dev에 방문하면 오른쪽 위에 'Try Dart'라고 있는데 여기서 간단하게 테스트해볼 수 있습니다.

코딩을 시작하는 사람들은 누구나 한다는 'Hello, world'를 구현해봅니다.

Try Dart를 눌러보면 'Hello, world' 예제가 아래와 같이 딱 나옵니다.

예제는 입력이 되어 있으니 오른쪽 Run버튼을 눌러봅니다. 입력한 내용의 결괏값을 보자는 의미입니다.

짠?

지금 이게 프로그램입니다! 축하합니다. 당신은 생애 첫 프로그램을 만든 것입니다. 당신도 이제 개발자입니다.

하지만 시작부터 막혔습니다ㅠㅠㅠ void는 무엇이고 main은 뭐고 뭔 괄호들이 이렇게 많은가요?

 

구조 뜯어먹기

저기서 main()으로 되어 있는 구조는 function or method라고 불리는 놈입니다.

프로그램이 시작될 때 제일 처음 찾는 function은 main() 이기에 main은 필수라고 볼 수 있습니다.

저 main fucntion뒤에 중괄호{}가 따라오는데 그 function을 이루는 body입니다.

그 바디안에 넣고 싶은 내용들을 넣어주면 됩니다. 

() 소괄호 안에 내용은 바디로 전달하고 싶은 내용을 넣으면 됩니다. 그렇다고 아무 말이나 넣을 순 없고

규칙을 따라야 합니다.

 

여기선 print()라는 함수(=function)를 넣어줬습니다.

print라는 함수는 main과는 다르게 이미 있는 기능을 쓸 수 있게 해주는 함수이기에 '괄호와 따옴표 안에 출력하고 싶은 값을 써주면 화면에 그대로 출력해주는 기능이다'라고 이해했습니다. 

 

함수는 주어진 걸로 써도 되지만 내가 만드는 것도 가능합니다.

화면에 글씨를 출력하기 위해서 print()를 쓰지 않고 testprint라는 함수를 만들어서 사용해보겠습니다.

 

 

 

 

 

 

 

main() 함수 밑에

testprint() 함수를 만들어 봤습니다. 소괄호 안에는 바디로 전달하고 싶은 내용이 들어간다고 했습니다.

그럼 1번 줄부터 읽으며 설명해보겠습니다.

1번 줄 : main함수를 만들게

2번 줄 : 그 안에는 testprint라는 함수가 있는데 밑에 만들어놨어 이걸 실행해줘. 그리고 그 함수에 'Hello, World!'라는 내용도 전달해줘

5번 줄 : testprint함수는 바디에 String 으로된 text1이라는 변수를 전달할 거야(String과 text1은 나중에 설명)

-> 이때 Hello, World라는 말은 'String의 형식으로 된 text1라는 변수(=주머니 정도로 이해)'에 저장되어 전달됨.

7번 줄 : testprint함수는 print함수를 통해 text1(주머니에 있는 걸 꺼내서) 출력하렴

 

;세미콜론은 무엇인가?

이 처럼 세미콜론은 해당 내용의 입력을 종료했다는 말입니다. 이 세미콜론은 쓰는 언어도 있고 안 쓰는 언어도 있는데 Dart에서는 사용한다고 하니 입력이 완료되었으면 ;으로 표시를 해줘야 합니다.

 

변수가 무엇인가?

아까 주머니라고 표현한 변수에 대해서 말해보자 이 주머니에는 숫자도 들어가고 글자도 들어가고 소수점이 있는 숫자도 들어가는 형태로 다양한 주머니가 있는데 각각의 data의 type에 맞게 올바른 주머니가 있습니다.

 

 

변수의 타입	설명
int	양수,0,음수 담는 주머니 // int num1 = 3;
double	소수점이 있는 숫자 담는 주머니 double num2 = 2.3;
String	문자열을 담는 주머니 String = 'global';
bool	true or false의 값을 리턴한다
List	data의 집합 (예시 : 숫자가 세개 들어 있는 list List L1 = [10, 21, 223];)
map	map<key, value>의 형태로 이루어짐. value를 가져오기 위한 key라고 이해했습니다. 예시 :  Map gifts = {  // Key :  Value  'first' : 'partridge',  'second' : 'turtledoves',  'fifth' : 'golden rings'  };

각 주머니를 만들 때 정수는 int, 소수점 숫자는 double 이런 식으로 데이터의 형태에 맞게 선언해줘야 하는데 

마법의 'var'를 쓰면 편하게 해당 주머니를 선언할 수 있습니다.

하지만 내가 나중에 코드를 다시 분석하거나 다른 사람이 봤을 때 해당 변수가 어떤 타입인지 쉽게 알아보게 하기 위해 

정확한 변수의 형태를 선언해주는 것을 추천한다고 합니다.

List나 map은 필요한 일이 생길 때 다시 공부해보기로 하고 넘어갑니다. 모두다 알고 가면 좋겠지만 필요할 때 공부하는게 지치지 않고 롱런할 수 있는 길^^