728x90 반응형 전체 글47 [Expo] Android apk 배포방법 Expo에서 안드로이드 apk 배포하는방법을 알아보자 React Native로 코드를 완성하였다. 하지만 아직 apk로 빌드되었지 않기때문에 앱으로는 실행할 수 없는 상태이다. 그렇다면 빌드를 해서 앱을 실행시켜보자. 빌드실행 현재 내가만든 앱은 Expo 프로젝트의 설정파일로 app.json을 사용하고있다. 하지만 eas.json이라는 설정파일도 존재한다. 둘은 각각 다른 목적을 가지고 사용할 수 있다. app.json: app.json은 Expo 프로젝트의 전반적인 설정을 포함하는 파일이다. 앱의 이름, 버전, 아이콘, 스플래시 화면, 설명 등과 같은 Expo 앱의 기본적인 설정이 들어간다. 앱의 공개 설정 및 특정 기능의 활성화 여부 등을 지정할 수 있다. eas.json: eas.json은 Expo.. 2023. 12. 5. [React Native] Navigation 기능. React native에서 앱을 만들때 꼭 필요한 기능에 대해 알아보자. React Native에서 페이지간 이동을 하기위해서는 navigation이 필요하다. React Native Navigation란? React Native 애플리케이션의 ‘페이지 이동’을 하는 내비게이션을 관리하고 구현하는 데 도움이 되는 라이브러리이다. 라이브러리는 React Native의 다양한 기능을 활용하여 내비게이션을 관리하며, iOS와 Android를 모두 지원한다. Navigation에는 다양한 종류가 있다. 순서대로 알아보도록 하자. 1. Native Stack Navigator 스택 형태로 화면 위에 새로운 화면을 쌓아서 탐색을 하는 네비게이션 컴포넌트이다. 일반적으로 많이 사용되며 스택형태로 쌓아두기 때문에 이전.. 2023. 12. 5. [React Native] 기본적이지만 필수적인 Styles 정리. react native에서 css를 직접적으로 사용할 수는 없지만 css와 비슷한 방식으로 style이 적용된다 스타일 속성은 자바스크립트 오브젝트로 나타낼 수 있으며, 배열을 전달할 수 있다. 가장 마지막에 나열한 스타일이 우선 순위를 가지게 된다. inline으로 스타일을 객체로 넣는 방법도 있지만 style코드가 길어지게 되면 코드를 정리하기도 힘들고 알아보기도 힘들기 때문에 위와 같이 별도의 Styles.js를 만들어서 여러 스타일을 한 곳에 정의하는 것이 더 깨끗하다. 또한 후의 apk빌드를 하였을때 기종마다 규격이 다르기 때문에 이와 같이 규격을 미리 정해놓고 style을 정의한다면 통일감을 줄 수 있고 코드를 관리하기에도 수월하다. 그렇다면 기본적이지만 필수적인 React native의 .. 2023. 12. 5. [React Native] 기본 개념 및 문법 정리 1. JSX란? JSX(JavaScript Syntax Extension)는 객체 생성과 함수 호출을 위한 문법적 편의를 제공하기 위해 만들어진 확장기능으로 리액트 프로젝트에서 사용된다. 가독성이 높고 작성하기 쉽다는 장점이 있으며 XML과 유사하다는 점에서 중첩된 nested 구조를 잘 나타낼 수 있다. JSX에서는 여러 개의 요소를 표현할 경우, 반드시 하나의 부모로 감싸야 한다. 다음과 같이 여러개의 요소를 포함할때 를 통해서 하나의 부모로 감싸주었다. 2. 자바스크립트 변수 JSX 내부에서는 자바스크립트의 변수를 전달하여 사용할 수 있다. 이렇게 미리 변수의 값을 할당해놓으면 다음과 같이 투표기간에 자바스크립트의 변수를 가져와서 사용할 수 있다. 3. 자바스크립트 조건문 복잡한 조건인 경우, JS.. 2023. 12. 5. [Expo] ReactNative Expo로 설치와 실행하기. Expo는 무엇일까? Expo는 React Native를 기반으로 하는 개발 도구 및 서비스로, React Native 애플리케이션을 더 쉽게 개발하고 빌드하며 배포하는 데 도움을 주는 플랫폼이다. Expo 설치방법 우선 Expo를 설치하기 전에 기본적으로 세팅해야할 부분이 있다. Expo를 설치하기 위해선 먼저 Node.js, Visual Studio Code가 설치되어 있어야 한다. Node.js부터 설치해보자. https://nodejs.org/en Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 이곳에서 node.js를 설치하면 되는데 주의사항이 있다. 최신버전으로 설치를 할 경우 .. 2023. 12. 5. [Github] 기초 명령어 및 사용 방법 GitHub는 전 세계 개발자들이 협업하고 소스 코드를 관리하는데 널리 사용되는 플랫폼이다. 그러나 GitHub를 올바르게 활용하기 위해선는 Git이 무엇이고 원리가 무엇인지에 대한 이해가 필요하다. 따라서 이번 포스팅에서 GitHub의 핵심 기능을 정확히 이해하고 GitHub를 효과적으로 활용하는 방법에 대해 알아보자. > 목차 1. Git hub란? 2. Git hub 원리 3. Git hub 기초명령어 4. Git hub 사용법 > 1. Git hub란? Git hub에 대해 알아보기전 Git이 무엇인지에 대해 먼저 알아보자 Git은 무엇인가? 더보기 Git이란, source code를 효과적으로 관리하기 위해 개발된 '분산형 버전 관리 시스템'으로, source code가 수정 또는 추가될 때 내.. 2023. 12. 5. [HTML] 웹 문서에 다양한 내용 입력하기 4-1 텍스트 입력하기 태그 hn태그는 웹문서에서 제목을 담당하고 있으며 크기에 따라 ndp 1~6까지의 숫자가 들어가고 제목 텍스트를 크기별로 표현할 수 있다. 기본형은 제목 이다. 태그 p태그를 사용하면 텍스트 앞 뒤로 빈줄이 생기면서 텍스트 단락이 만들어진다. 기본형은 내용 이다. 태그 줄바꿈 태그이고 원하는 위치에서 줄을 바꿀 수 있다. 기본형은 이다. 태그 인용문을 나타낼때 사용하는 태그이고 태그안의 내용을 인용문으로 인식하여 다른 텍스트보다 약간 들여쓴다. 기본형은 인용문 이다. , 태그 두가지 태그 모두 텍스트를 굵게 표시하여 주지만 strong태그는 강조를 위해서 사용하고 b태그는 글자만 굵게 표시할때 사용한다. 기본형은 텍스트 텍스트 이다. , 태그 두가지 태그 모두 이탤릭체로 텍스트를 .. 2023. 8. 26. <HTML> 1장.설치와 기본 입력 프론트앤트에서 제일 기본이 되는것 3가지는 HTML,CSS,JAVA SCRIPT이다. 그 중 제일 기본이 되는 HTML부터 공부를 해보도록 하자. 우선 제일먼저 VS CODE를 설치해야 한다. VS CODE 설치 https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS.. 2023. 8. 8. 2장 알아둬야 할 자바 스크립트 2015년 자바스크립트 문법에 큰 변화가 있었다 바로 ES2015(ES6)의 등장이다. 현재는 ES2023까지 나왔고 ES2015이상의 자바스크립트를 ES2015+라고 표현하겠다. 이 ES2015+문법을 통해 공부하므로 몇가지를 가볍게 알고 넘어가보도록 하자. codepen 사이트를 활용하여 자바스크립트 문법을 연습할 수 있다. ---const, let --- 자바스크립트를 배울때 가장 먼저배우는 문법이다. 옛날에 자바스크립트를 배웠다면 var로 변수를 선언한다고 배웠을것이고 최근에 공부를 하였다면 const와 let을 통해 선언한다고 배웠을 것이다. 다음과 같이 var를 활용하여 코드를 작성하면 3이 정상적으로 출력된다. 하지만 var를 const로 바꾸게 된다면 값이 출력되지 않는다. 이유가 무엇일까.. 2023. 7. 21. 이전 1 2 3 4 5 6 다음 728x90 반응형
