반응형 JavaScript25 [React,두둥] 카카오톡 로그인 (1) 카카오톡을 통해 사용자 정보를 받아오고 이를 파이어베이스를 통해 가입 및 로그인을 구현하자. 1. Kakao Developers 에 가입을 한 후 어플리케이션을 추가하자. 2. root/public/index.html ... JAVASCRIPT_KEY 는 Kakao Developers -> 내 애플리케이션 -> My App -> 앱 키 (JavaScript 키) 3. App.js //Line 1 /*global Kakao*/ function App(){ useEffect(()=>{ console.log(Kakao.isInitialized()) },[]) return( ... ) } 한 번 더 확인해준다. /*global Kakao*/를 필수적으로 적어주자. Kakao.Auth.authorize는 redi.. 2021. 3. 18. [두둥] react-responsive & react-device-detect 파이어베이스로 호스팅을 하기 때문에 하나의 프로젝트에 하나의 소스만 올릴수 있다. 따라서 두가지 방법이 있다. 1안 웹용 소스, 모바일용 소스를 각각의 프로젝트에 올려서 domain.com 과 m.domain.com에 적용할지 2안 하나의 소스 내부에서 PC || Table || Mobile 을 판단해서 이에 따라 적용할 소스를 바꿔주는 것이다. 관련 정보를 찾아본 결과 "반응형 모듈" 을 사용해서 구현하는것이 대중적으로 보인다. 이는 화면의 크기에 따라 구분하는 것이다. github.com/contra/react-responsive#react-responsive-- contra/react-responsive CSS media queries in react - for responsive design, a.. 2021. 3. 17. [ReactNative] react-native-picker itemStyle in Android react-native-picker의 itemStyle 속성은 iOS 에서만 작동된다고 써있다 따라서 Android 에서는 따로 커스텀 할 수 없는 것으로 알고있었다. 하지만 StackOverFlow에서 Android Style.xml 단에서 수정하여 적용시키는 법을 찾았다. stackoverflow.com/questions/38921492/how-to-style-the-standard-react-native-android-picker#comment80255009_39141949 How to style the standard react-native android picker? I am unable to style it. There is hardly any documentation on this. I wa.. 2020. 12. 24. [React Native] Splash Image dev-yakuza.posstree.com/ko/react-native/react-native-splash-screen/ App Splash 스크린 RN(React Native) 프로젝트에서 react-native-splash-screen를 사용하여 Splash 스크린을 원하는 시간에 종료하도록 만들어 보자. dev-yakuza.posstree.com github.com/crazycodeboy/react-native-splash-screen crazycodeboy/react-native-splash-screen A splash screen for react-native, hide when application loaded ,it works on iOS and Android. - crazycodeboy/r.. 2020. 12. 1. [React Native & Android] Build apk,abb velog.io/@dear_sopi9211/react-native-%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C-APKAAB-%ED%8C%8C%EC%9D%BC-%EC%83%9D%EC%84%B1%ED%95%98%EA%B8%B0 [react-native] 안드로이드 APK(AAB) 파일 생성하기📱 Production test build 하기 전에 먼저 해당 프로젝트 에뮬레이터 또는 Android device에서 성공적으로 컴파일이 되고 실행이 되고 오류는 없는지 확인한 후 진행하여야 합니다. 1. key store 생성 Android 용 Rea velog.io 1. [React Native Project] / android / app 안에 .keystore 혹은 .jks .. 2020. 11. 30. [React Native, FireBase ect] Firebase 오류 (app:multiDexListDebug) Firebase를 사용하기 위해서 npm install 을 하고 run-android 를 하였더니 build 과정에서 여러가지 문제가 발생하였다. 그래서 프로젝스/android 로 이동하여 (cd android) gradlew clean을 진행 한 후 npx react-native run-android를 하였더니 해결이 되었다. 이후 몇 가지 라이브러리(ex. @react-native-firebase/firestore)를 더 설치하고 나서 위와 같은 오류가 발생하여 같은 방법으로 해결하려 했으나 다른 오류인걸 확인하였다. Task :app:mergeDexDebug FAILED 이였다. 쭈욱 읽어보니 공식문서에서 원인과 해결방법을 제공하고 있다. developer.android.com/studio/buil.. 2020. 11. 24. [React Native] Change Package(Android) & Bundle Id(iOS) =====Change Package Name [Android]===== stackoverflow.com/questions/37389905/change-package-name-for-android-in-react-native Change package name for Android in React Native I used react-native init MyApp to initialise a new React Native app. This created among others an Android project with the package com.myapp. What's the best way to change this package name, for e... stackoverflow.com dev.to/.. 2020. 11. 24. [React Native] 시작하기 (Windows 10) reactnative.dev/docs/environment-setup Setting up the development environment · React Native This page will help you install and build your first React Native app. reactnative.dev Expo로 부터 탈출하기 위해서 Bare React Native를 사용하기로 하였다. 위 링크를 통해 프로젝트를 시작해보려고 한다. Chocolatey Chocolatey - The package manager for Windows Chocolatey is software management automation for Windows that wraps installers, executab.. 2020. 11. 19. [React, Next.js] When to Use Static Generation VS Server-side Rendering nextjs.org/learn/basics/data-fetching/two-forms Learn | Next.js Production grade React applications that scale. The world’s leading companies use Next.js by Vercel to build pre-rendered applications, static websites, and more. nextjs.org 보통의 경우에는 Static Generation을 권장하지만 유저의 요청에 따라 빈번하게 데이터를 업데이트해야하는 경우라면 Server-side Rendering을 추천한다. 2020. 10. 25. [React Native] Child Navigator 에서 Parent Navigator 의 Header Title 바꾸는법 (feat. stackoverflow) 출처 : stackoverflow.com/questions/60363195/react-navigation-header-title-in-nested-tab-navigator React Navigation header title in nested tab navigator I have a Tab Navigator inside a Stack Navigator and I want the header title to be dynamically configured as the title of the tab selected. Like there's 3 tabs: Home, Profile, Add Item and I want the stackoverflow.com [원글] I have a Tab Navigator ins.. 2020. 10. 4. [React Native & Expo] Google Login 구글로그인 www.youtube.com/watch?v=ZcaQJoXY-3Q&ab_channel=UnsureProgrammer www.youtube.com/watch?v=GZKaVJEd4JU&ab_channel=UnsureProgrammer 순서대로 따라하면 된다. 2020. 9. 29. [React Native & Expo & Firebase] Google Login_React Navigation Basic [Using Visual Studio Code] [Using Firebase] reactnavigation.org/docs/getting-started Getting started | React Navigation What follows within the Fundamentals section of this documentation is a tour of the most important aspects of React Navigation. It should cover enough for you to know how to build your typical small mobile application, and give you the background that you reactnavigation.org np.. 2020. 9. 28. 이전 1 2 3 다음 반응형
