전체 글 (20) 썸네일형 리스트형 CORS error Access-Control-Allow-Origin Multiple type, nodejs 흔히 보는 CORS Access-control-allow-origin error 참고: Single type res.setHeader("Access-Control-Allow-Origin", "yourdomain" ); multiple type app.use((req, res, next) => { const allowedOrigins = ["http://localhost:3000", "https://yourdomain.co", "https://otheryourdomain.co"]; const origin = req.headers.origin; if (allowedOrigins.includes(origin)) { res.setHeader("Access-Control-Allow-Origin", origin);.. Gabia domain connect 내가 만든 프로젝트 배포를 위해 도메인 제공 사이트를 찾다가 gabia.com 을 찾아보았다 현재 나는 render.com &heroku.com 에서 배포설정을 하고있다. (autometic deploy를 둘다 지원함- 깃허브에 파일을 올려서 랜더링 사이트에서 변경된 점이 있으면 자동으로 배포를 함) heroku.com은 정적 ip를 사용에서 동적 ip사용으로 더이상 고정된 정적ip를 지원하지 않고 있다. 그래서 도메인 연결에서 value값인 정적ip를 요구하는 gabia.com 에서는 적절하지 않았다. 그래서 나는 render.com에서 지원하는 정적ip주소를 가지고 gabia.com에 도메인을 구입한 후 value 값에 넣어주었다. 1.먼저 gabia.com에 접속하고 회원가입 후 도메인을 구입한다... Warning 해결! React17->React18 [ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17] index.js import ReactDOM from "react-dom"; React 17 version ReactDom 위 코드를 삭제 후 import {createRoot} from 'react-dom/client'; 삽입해준 후 const root = createRoot(document.getElementById('root')) ReactDOM.render( , document.getElementById("root") ); 여기서 ReactDom.render 부분을 root.render( 변경해준 후 document.getElementById("root") 를 제거해주면된다. root.render( , ); 결과. 웹에서 개발자 도구를 확인해보자. mongoDB connect 몽고DB연결 (mongoose 이용) 설치 npm install mongoose 사용 const mongoose = require("mongoose"); mongoose .connect(process.env.MONGODB_URI) .then(() => { console.log("connected to db"); }) .catch((err) => { console.log(err.message); }); server.js .env file에서 몽고db에서 받은 url을 적어두고 require("dotenv").config(); 선언부에 적어둔 후 .env파일 사용 mongoDB 에서 데이터베이스를 만든 후 connect를 누르면 url이 나온다 거기서 만든 database 아이디명과 패스워드를 입력후 url.. Could not resolve dependency error peer react@"^16.8.0 || ^17.0.0" from @material-ui/core@4.12.4 강제: npm config set legacy-peer-deps true 패키지 재설치 npm i 문자열 정규화(n번째위치)with React-native Javascript 문자열 n번째 위치에 특수문자 삽입하기 (.{3})문자열3번째 뒤에 $1- = 첫번째 ( )안에 '-' 추가 결과 Lottie & Animation with React-native JS //선언부 import LottieView from "lottie-react-native"; import React, { useState, useRef } from "react"; Lottie 라이브러리를 활용한 React-native 애니메이션 구현 Lottie library GitHub: https://github.com/lottie-react-native/lottie-react-native GitHub - lottie-react-native/lottie-react-native: Lottie wrapper for React Native. Lottie wrapper for React Native. Contribute to lottie-react-native/lottie-react-native devel.. Carousel+Swipe 감지후 modal연결 개발을 하다가 누구나 여러번 의도치 않은 에러와 접촉한다. 오늘도 그 많은 경험중에 한번이다. Carousel 연결 후 이미지를 클릭 시 modal로 연결되는 앱을 만드는 도중 Pressable로 이미지를 클릭하면 modal로 연결되는 기능까지는 구현하였다. 하지만 내가 원하는 것은 Carousel 이미지를 클릭시에만 modal로 연결하는 것이지 좌우로 Swipe를 한다고해서 modal로 연결하고 싶지는 않았다. 그래서 많은 Pressable props를 뒤져 몇시간을 고생하였지만 답이나오지 않았다. 그래서 더 찾아보던 도중 Swipe를 감지하는 라이브러리를 찾았는데 그것은 GestureRecognizer 였다. 설치방법은 이러하다 이렇게 한 후 Pressable 바깥에 GestureRecognizer를.. 이전 1 2 3 다음