분류 전체보기 (179) 썸네일형 리스트형 [#. Django] The current path ~ didn’t match any of these django에서 업로드한 이미지 불러오지 못 하는 에러 해결 django react 프로젝트에서 django에서 모델 생성 후 react에서 모델(텍스트, 이미지)을 불러오려고 한다 django admin에서 이미지를 업로드하고 프로젝트 폴더 media/uploads가 생성되고 이미지 파일도 잘 들어가 있다 하지만 localhost:8000/media/uploads/[image파일명].jpeg url을 입력하면 이미지를 불러오지 못 한다 이렇게 404 페이지가 뜬다 일단 내가 생성한 django react 프로젝트 구조는 이렇다 ① backend/settings.py MEDIA_ROOT = os.path.join(BASE_DIR, 'media') MEDIA_URL = '/media/' ② backend/urls.py from django.conf import se.. [#. Django] ValueError: The field admin.LogEntry.user was declared with a lazy reference to~ 에러 해결하기 DRF(Django Rest Framework)에서 로그인/회원가입 관련해서 세팅하는데 python3 manage.py makemigrations 마이그레이션 했을 시에 발생한 에러다 migrations 폴더에 __init__.py 파일을 제외한 파일/폴더 삭제 db.sqlite3 파일 삭제한 후 마이그레이션, 마이그레이트 하면 해결된다 python3 manage.py makemigrations python3 manage.py migrate 참고 stackoverflow.com/questions/50324561/valueerror-the-field-admin-logentry-user-was-declared-with-a-lazy-reference ValueError: The field admin.LogEn.. [#. React] react-device-detect 설치 후 웹/모바일 감지해서 반응형 사이트 만들기 react로 웹을 개발하려고 하는데 모바일 사이즈에서도 볼 수 있도록 반응형으로 개발해야 한다 react-device-detect를 설치하면 웹/모바일을 감지해서 따로 코딩할 수 있다 https://www.npmjs.com/package/react-device-detect react-device-detect Detect device type and render your component according to it www.npmjs.com ① react-device-detect 설치 npm install --save react-device-detect ② Landing.js 수정 ⑴ BrowserView, MobileView 사용하기 mport React from 'react'; import { Brow.. [#. React] React에서 swiper 사용하기, 배너 슬라이드 사용하기 html에서 swiper 사용하는 것과 조금 다르기 때문에 React에서도 swiper를 사용해 보려고 한다 swiperjs.com/react Swiper React Components Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com ① swiper 설치하기 npm install --save swiper ② 프로젝트/src/components/MainPage/MainPage.js import { Swiper, SwiperSlide } from 'swiper/react'; import SwiperCore, { Navigat.. [#. Django] Django(Rest Framework) + React로 프로젝트 시작하기 데이터 시각화를 위해 Python을 사용해야 하는데 그 중에서도 Django framework를 사용하고 싶다 또한 Back/Front 분리를 위해 front는 React를 사용하려고 한다 React에서는 axios로 Django로부터 Rest API로 데이터를 받아와서 사용할 것이다 Django와 React를 연동하는 몇 가지 예제를 찾아봤지만 React에서 eject(npm run eject)해서 시작하기 때문에 그 방법은 사용하지 않았다 ① Django 설치하기 virtualenv 가상환경이 설치되었다고 가정하고 시작하겠다 mkdir django-react cd django-react virtualenv venv source venv/bin/activate// 가상환경 실행 pip3 install .. [#. React] Kakao 카카오 지도 API를 이용해서 키워드로 장소 검색하기, 검색한 장소 마커 띄우기, 검색 결과 리스트 가져오기 2 키워드 검색 후 마커만 띄울 거라면 이 글을 참고하면 된다 앞글에 가서 kakao developers에서 앱키 발급 후 세팅만 하고 오자 developer0809.tistory.com/90 [#. React] Kakao 카카오 지도 API를 이용해서 키워드로 장소 검색하기, 검색한 장소 마커 띄우기 ① APP KEY 발급 받기 카카오에서 상세한 발급 과정을 알려준다 이렇게 앱키를 발급 받았으면 여기서 JavaScript 키를 사용할 것이다 ② 프로젝트/public/index.html 사이 아래 script를 추가한다 ③ 프로젝 developer0809.tistory.com ① 프로젝트/src/components/views/Landing/Sections/MapContainer.js import React,.. [#. React] Kakao 카카오 지도 API를 이용해서 키워드로 장소 검색하기, 검색한 장소 마커 띄우기 ① APP KEY 발급 받기 카카오에서 상세한 발급 과정을 알려준다 이렇게 앱키를 발급 받았으면 여기서 JavaScript 키를 사용할 것이다 ② 프로젝트/public/index.html 사이 아래 script를 추가한다 ③ 프로젝트/src/components/views/Landing/LandingPage.js import React, { useState } from 'react' import MapContainer from './Sections/MapContainer' function LandingPage() { const [InputText, setInputText] = useState('') const [Place, setPlace] = useState('') const onChange = (e) .. [#. React] React에서 checkbox select all 체크박스 전체 선택, 전체 선택 해제 하기 React에서 Checkbox 전체 선택/전체 해제, 각각 체크/해제를 해보자 난 UI Framework로 ant design을 사용해서 antd에서 Checkbox를 가져왔지만 아닌 경우, 다른 프레임워크에서 가져오거나 이렇게 input으로 가져와서 type을 checkbox로 지정해서 사용해도 된다 import React, { useState, useEffect } from 'react'; import { Checkbox } from 'antd'; function CheckTest(props) { const [CheckList, setCheckList] = useState([]) const [IdList, setIdList] = useState([]) // 장바구니 리스트 props로 받아왔을 때, .. 이전 1 ··· 9 10 11 12 13 14 15 ··· 23 다음
