앱개발 종류
- 안드로이드, iOS 각각 개발 하는 네이티브 앱
- 웹 사이트를 만들고 껍데기를 씌워 간단히 배포하는 하이브리드 앱
- 네이티브 앱과 하이브리드 앱 개발의 장점들을 모아놓은 크로스 플랫폼 앱
앱개발반에서는 크로스 플랫폼 앱을 리액트 네이티브 언어를 사용해 만든다.
리액트 네이티브(React Native)
- 페이스북에서 만들고 지원
- 사용자 인터페이스(UI)를 만드는 데에 특화되어 있는 리액트(React.js) 라이브러리/프레임워크 기반으로 앱을 제작하는 기술
필수 프로그램
Javascript
- javascript는 웹에서 움직이는 것을 담당할 뿐 아니라 앱 또한 구현한다
Javascript 기초 문법
- 콘솔 출력
console.log('출력할 내용') - 변수 선언
let num = 5
num = 'apple'참고 - 변수명 표기법
1. 카멜 표기법 : 각 단어 첫글자가 대문자. 단 처음 단어의 첫글자는 소문자
예) camelCase, testCase
2. 스네이크 표기법 : 단어 사이에 언더바(_), 전부 소문자
예) snake_case, test_case
3. 파스칼 표기법 : 카멜 표기법 + 첫 단어 첫글자는 대문자
예) CamelCase, TestCase
- 사칙연산
let a = 1
let b = 2
a+b // 3
a/b // 0.5
let first = 'Bob'
let last = 'Lee'
first+last // 'BobLee'
first+' '+last // 'Bob Lee'
first+a // Bob1 -> 문자+숫자를 하면, 숫자를 문자로 바꾼 뒤 수행합니다.- const로 상수 변수 선언
let value_box = '값'
value_box = '변경한 값';
console.log(value_box) // 콘솔엔 '변경한 값'이 찍힙니다.
const value_fix = '값';
value_fix = '변경한 값';
console.log(value_fix) // const로 선언한 변수엔 새로운 값을 재 할당(다시 입력!) 할 수 없습니다.- 리스트 함수
let a_list = [] // 리스트를 선언. 변수 이름은 역시 아무렇게나 가능!
// 또는,
let b_list = [1,2,'hey',3] // 로 선언 가능
b_list[1] // 2 를 출력
b_list[2] // 'hey'를 출력
// 리스트에 요소 넣기
b_list.push('헤이')
b_list // [1, 2, "hey", 3, "헤이"] 를 출력
// 리스트의 길이 구하기
b_list.length // 5를 출력- 딕셔너리 함수
let a_dict = {} // 딕셔너리 선언. 변수 이름은 역시 아무렇게나 가능!
// 또는,
let b_dict = {'name':'Bob','age':21} // 로 선언 가능
b_dict['name'] // 'Bob'을 출력
b_dict['age'] // 21을 출력
b_dict['height'] = 180 // 딕셔너리에 키:밸류 넣기
b_dict // {name: "Bob", age: 21, height: 180}을 출력- 딕셔너리 다른 표현
let b_dict = {'name':'Bob','age':21}
//bob 이름을 꺼낼땐 두 가지 방식으로 깞을 꺼낼 수 있습니다.
b_dict['name']
b_dict.name
둘다 똑같이 딕셔너리의 키값에 접근하여 값을 꺼내옵니다.Javascript 기본 제공 함수
- 소문자를 대문자로 변환
문자열.toUpperCase()
let myname = 'spartacodingclub'
myname.toUpperCase() // SPARTACODINGCLUB- 대문자를 소문자로 변환
문자열.toLowerCase()
- 특정 문자로 문자열 나누기
문자열.split('문자')
let myemail = 'sparta@gmail.com'
let result = myemail.split('@') // ['sparta','gmail.com']
result[0] // sparta
result[1] // gmail.com
let result2 = result[1].split('.') // ['gmail','com']
result2[0] // gmail -> 우리가 알고 싶었던 것!
result2[1] // com
myemail.split('@')[1].split('.')[0] // gmail -> 간단하게 쓸 수도 있다!
let txt = '서울시-마포구-망원동'
let names = txt.split('-'); // ['서울시','마포구','망원동'- 특정 문자로 리스트 값 합치기
리스트.join('문자')
let result = names.join('>'); // '서울시>마포구>망원동' (즉, 문자열 바꾸기!)javascript 함수 생성
// 만들기
function 함수이름(필요한 변수들) {
내릴 명령들을 순차적으로 작성
}
// 사용하기
함수이름(필요한 변수들);조건문
- if문
function is_adult(age){
if(age > 20){
alert('성인이에요')
} else if (age > 10) {
alert('청소년이에요')
} else {
alert('10살 이하!')
}
}
is_adult(12) // '청소년이에요'반복문
- for문
let people = ['철수','영희','민수','형준','기남','동희']
for (let i = 0 ; i < people.length ; i++) {
console.log(people[i])
}
// 리스트 원소 하나씩 출력- while문
let i = 0
while (i < people.length) {
console.log(a_list[num])
num++
}
// 리스트 원소 하나씩 출력