본문 바로가기

Dev/앱 개발일지5

스파르타 코딩클럽 앱개발 종합반 5주차 1. 취지 & 설명 : 첫 메인 화면에서 내가 원하는 콘텐츠를 웹진 형태로 노출하면서 간단한 이미지와 내용 일부를 보여줄 수 있도록 구성하였다. 카테고리 탭 메뉴를 배치하여 각 주제에 맞는 콘텐츠를 볼 수 있도록 필터 기능을 넣어서 검색의 편의성도 추가하였다. 현재는 강의 과정에서 등록한 팁 데이터로 구성되어 있는데 콘텐츠 내용은 추후 업데이트 할 예정이다. 2. 기술 설명 : 리액트 네이티브를 기반으로 앱을 개발하였고, 데이터는 firebase를 활용하여 가볍게 활용할 수 있도록 개발하였다. 화면 구성에는 네비게이션 영역과 콘텐츠 영역을 구분하였고, 반복적으로 사용 가능한 페이지 내 구성요소들은 컴포넌트로 분리하여 재사용 할 수 있도록 제작했다. 데이터를 가져오는 부분은 리액트의 state를 활용해서 .. 2023. 4. 3.
스파르타 코딩클럽 앱개발 종합반 4주차 1. 앱과 서버 앱에 모든 데이터를 넣을 수 없다 앱 용량이 커질 수 있고, 데이터가 업데이트 되면 다시 배포를 해야 한다. 데이터가 담긴 서버를 배우고, 서버에서 데이터를 가져오고 변경하는 방법을 배운다. 2. 서버리스 : 데이터 생성, 조회, 삭제/수정 등을 제공해 주는 서비스 3. 파이어베이스 사용 4. 날씨 서버 외부 API 앱과 서버의 동작 방식 : 서버가 정한 규칙에 따라 대화 요청(Request)을 해야 한다. 서버에서 정한 규칙을 보통 API(Application Programming Interface)라고 부른다. 서버가 제공하는 도메인일수도 있고 서버가 만들어놓은 함수를 그냥 이용해서 사용하는 규칙일 수도 있다. 리액트 네이티브 주로 데이터를 준비하는 시점 앱 화면이 그려진 다음 데이터.. 2023. 3. 29.
스파르타 코딩클럽 앱개발 종합반 3주차 1. 3주차 배울 내용 컴포넌트(Component), 상태(State, useState), 속성(Props), useEffect 2. 앱 상세 화면 만들기 import React from 'react'; import { StyleSheet, Text, View, Image, ScrollView,TouchableOpacity,Alert } from 'react-native'; export default function DetailPage() { const tip = { "idx":9, "category":"재테크", "title":"렌탈 서비스 금액 비교해보기", "image": "https://storage.googleapis.com/sparta-image.appspot.com/lecture/money1.. 2023. 3. 24.
스파르타 코딩클럽 앱개발 종합반 2주차 1. 리액트 네이티브 & Expo 리액트 네이티브는 자바스크립트 언어 하나로 안드로이드 앱과 iOS 앱 두 가지 모두 만들어주는 라이브러리 Expo는 안드로이드 & iOS 코드를 건드려야 하는 대부분의 상황들을 안 건드려도 되게끔 도와주는 툴 개발 중인 앱 테스트를 위한 Expo Go 앱을 제공 npm install -g expo-cli expo start 윈도우 : 컨트롤 + c 맥 : command + c 2. JSX 문법 App.js는 앱의 화면을 그려주는 커다란 함수 HTML 태그 같이 생긴 이 문법은 JSX라 불리우며 실제 화면을 그리는 문법 styles 변수 : JSX문법을 꾸며주는 내용 import { StatusBar } from 'expo-status-bar'; import React f.. 2023. 3. 15.
스파르타 코딩클럽 앱개발 종합반 1주차 1주차 수업은 기본적인 스크립트에 대한 설명과 앱 개발을 위한 개발환경 세팅이어서 큰 어려움 없이 진행할 수 있었다. 1. 앱 서비스의 기본 동작 구조 클라이언트와 서버 : 클라이언트는 사용자가 보는 화면 서버는 데이터가 있는 곳이고, 원하는 데이터를 요청하면 응답해주는 곳이기도 하다. 2. 앱과 리액트 네이티브 앱 개발은 "안드로이드" 와 "iOS(아이폰)" 안드로이드는 Java & Kotlin 기술로 개발 iOS는 Swift 기술로 개발 안드로이드, iOS 각각 개발 하는 건 네이티브 앱 웹 사이트를 만들고 껍데기를 씌워 간단히 배포하는 건 하이브리드 앱 "크로스 플랫폼 앱" 개발이 존재 리액트 네이티브(React Native) 크로스 플랫폼 앱 개발 언어 중 하나 페이스북에서 만들고 지원하고 있으며.. 2023. 3. 13.

티스토리툴바