전체 글 135

2021-10-29 [iOS] Could not find a valid GoogleService-Info.plist in your project

분명히 firebase에서 googleservice-info.plist 파일을 다운로드해서 ios/{프로젝트명}에 넣어주었는데 위와 같은 에러가 발생할 수 있다. 이는 평소 습관대로 파일을 드래그&드롭해서 발생한 문제이다. 직접 파일을 옮겨주지 말고 Xcode로 프로젝트를 오픈한 후 프로젝트 폴더에서 우클릭-Add files to "프로젝트명"을 클릭하여 googleservice-info.plist 파일을 넣어준다. 파일을 넣어줄 때 설정은 다음과 같다.

잡다한 교훈 2021.10.29

2021-10-28 안드로이드 개발 환경 세팅 (React Native)

1. 자바 설치 [1] 윈도우즈 (Windows) (1) https://java.oracle.com/ 에 접속하여 JAVA SE 8u311을 다운로드 후 설치한다. (2021-10-28 기준) ※ JDK와 JRE - JDK : 자바 언어로 프로그램을 제작할 때 필요 - JRE : 자바로 제작된 프로그램을 실행하는 데 필요 (JDK 설치시 자동으로 따라옴) (2) 환경변수를 설정한다. - 설치한 JDK의 경로를 복사한다. (경로를 별도로 지정하지 않은 경우 C:\Program Files\Java 안에서 확인할 수 있다.) - 시스템 환경변수로 들어가서 JAVA_HOME 변수를 추가해준다. (값 : 복사한 JDK의 경로, ex. C:\Program Files\Java\jdk--) - CLASS_PATH 변수..

모바일 이야기 2021.10.28

2021-10-27 React Native - SDK location not found. Define location with an ANDROID_SDK_ROOT environment variable or by setting the sdk.dir path in your project's local properties file

npx react-native run-android를 실행하였는데 Could not determine the dependencies of task ':app:compileDebugJavaWithJavac'. > SDK location not found. Define location with an ANDROID_SDK_ROOT environment variable or by setting the sdk.dir path in your project's local properties file at '...'. >> 과 같은 오류가 발생한 경우 해결방안 (1) ANDROID_HOME 환경변수와 별개로 ANDROID_SDK_ROOT 환경변수를 생성한다. (값은 동일하게 적용) (2) 프로젝트의 android 폴더..

잡다한 교훈 2021.10.27

2021-10-22 일지

1. 클라이언트 측에서 CORS 해결 방법 (1) Chrome 바로가기를 하나 새로 생성한다. (2) 바로가기의 속성을 클릭한 후 바로가기 탭의 대상 영역 맨 뒤에 --disable-web-security --user-data-dir="C:\chrome"를 추가한다. (3) 해당 바로가기를 통해 다시 크롬을 실행하면 서버 측의 작업 없이도 CORS를 무시한 작업이 가능하다. 2. axios에서 폼 데이터를 전송하는 방법 (1) const bodyFormData = new FormData( ); (2) bodyFormData.append('key', 'value'); => 전송할 데이터를 넣어줌 (3) headers의 Content-Type을 'multiplart/form-data'로 지정하여 axios ..

잡다한 교훈 2021.10.22

2021-10-19 Android 어플과 Realtime Database

https://rnfirebase.io/database/usage Realtime Database | React Native Firebase Copyright © 2017-2020 Invertase Limited. Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. Some partial documentation, under the rnfirebase.io 필요 작업을 모두 수행했음에도 불구하고 Realtime DB 처리가 되지 않는 문제가 발생..

잡다한 교훈 2021.10.19

2021-10-02 반응형 웹

1. 반응형 웹 (Responsive Web) - 하나의 HTML 파일과 하나의 URL로 각 기기 혹은 환경에 최적화된 웹페이지를 제공하는 것 - 모바일 기기 발전 초기에는 별도의 모바일 페이지를 운영하였는데 PC/모바일 두 가지 웹을 동시에 제작/관리해야 하는 문제가 발생해야 함에 따라 반응형 웹이 등장하였다. - 장점 (1) 유지보수가 간편하다 : 모바일, 태블릿, 데스크톱 등 다양한 환경에 대한 디자인을 하나의 파일에서 관리 (2) 마케팅에 용이하다 : 웹 마케팅에서는 접근성이 중요하기 때문 (3) SEO에 유리하다 : 반응형 웹은 하나의 주소와 하나의 파일만을 가지기 때문에 검색 엔진에 더 많이 노출되고 광고 비용을 줄일 수 있다. (PC/모바일 웹을 각각 운영하는 경우 무슨 정보가 정확한지 판단..

2021-09-28 React Component

React Component props를 input으로 하고 UI가 어떻게 보일지 정의하는 React Element를 output으로 하는 함수이다. 1. React Component의 생명 주기 (1) Mount (생성) : 컴포넌트의 인스턴스가 생성되어 DOM 상에 순서대로 호출된다. (2) Update (갱신) : props 혹은 state가 변경되었을 때 일어난다. (3) Unmount(소멸) : 컴포넌트가 DOM 상에서 제거될 때 2. React Component의 인스턴스 속성 → UI 데이터를 관리 (1) props (속성값) - 할당된 후 값을 변경할 수 없다. (불변변수) - 컴포넌트 간에는 무조건 props를 통해 데이터를 주고받는다. - 부모 컴포넌트가 렌더링될 때마다 자식 컴포넌트들..

2021-09-28 UI & UX

1. UI (User Interface) - 사용자가 제품/서비스를 사용할 때 마주하는 면이다. (둘이 상호작용할 수 있는 매개체) - UI 디자인은 폰트, 칼라, 레이아웃 등 사용자가 마주하는 시각적 디자인을 말한다. 2. UX (User eXperience) - 사용자가 어떠한 서비스/제품을 직간접적으로 이용하면서 느끼는 종합적인 만족. - UX 디자인은 사용자에게 만족스러운 경험을 제공하는 디자인을 의미한다. - UX 기획자는 사용자의 행동을 분석하고 서비스에서 개선할 부분을 발견한다. (ex. 특정 메뉴를 사람들이 이용하지 않는다) (1) 정량적 분석 : 주로 순 방문자 수(UV), 페이지의 뷰 수(PV)를 지표로 활용한다. (2) 정성적 분석 : 초점집단 인터뷰 방법 혹은 전화·인터넷으로 접수된..

2021-09-25 자바스크립트 기본 특징

1. 자바스크립트는 객체 기반 스크립트 언어이다. 클래스를 이용하여 호출한 후에 객체가 생성되는 자바와 달리 자바스크립트는 클래스가 필요없이 호출과 동시에 객체가 생성된다. 2. HTML은 웹의 내용을 작성하고 CSS는 그를 꾸며주며 JS는 웹의 동작을 구현한다. 3. 자바스크립트는 주로 웹 브라우저에서 사용되나 Node.js와 같은 프레임워크를 활용하면 서버 프로그래밍과 같이 브라우저 밖에서도 사용이 가능하다. 4. 현재 컴퓨터나 스마트폰 등의 대부분 웹 브라우저에는 자바스크립트 인터프리터가 포함되어 있다. 5. 자바스크립트는 동적이며 타입을 명시할 필요가 없는 인터프리터 언어이다. 컴파일 언어 - 컴파일러를 통해 고급 언어를 기계어로 변환하는 언어 - 컴파일된 후의 기계어는 실행 속도가 빠르다. - ..