본문 바로가기

분류 전체보기

 (179)
[#. React] redux payload가 Promise {<pending>} 반환할 때 문제 해결, PromiseResult 가져오기 DRF(Django Rest Framework) + React 프로젝트에서 React에서 API에 post로 데이터를 넣으려고 한다 구조는 이런 상태이다 ① frontend/src/_actions/user_actions.js rest api로 Test 모델에 임의의 데이터 items를 넣으려고 한다 데이터는 잘 들어간다 "aa": 4가 내가 임의로 넣은 값이다 ② frontend/src/_reducers/user_reducer.js 근데 문제는 reducer에서 actions.payload를 console에 찍어보면 아래와 같이 뜬다는 것이다 PromiseResult에 있는 object를 가져오고 싶어도 불가능하다 온갖 방법을 다 찾아봤지만 일단 문제가 발생하는 이유는 promise 형식을 payload..
[#. JavaScript] 동등 연산자 '=='와 일치 연산자 '==='의 차이점 ① == '=='는 동등 연산자로 비교하는 두 개의 값(피연산자)이 서로 다른 타입이면 강제로 같은 타입으로 변환한 후 비교한다 두 값의 타입이 다르더라도 형 변환된 값이 같다면 true를 리턴한다 ② === '==='는 일치 연산자로 비교하는 두 값의 타입과 값이 모두 같을 경우에만 true를 리턴한다 console.log(0 == '0');// true console.log(0 === '0');// false console.log(false == '0');// true console.log(true == '1');// true console.log(null == undefined);// true console.log(null === undefined); // false * React에서는 === 사용..
[#. Django] Django admin/api(drf)에 image 업로드하고 react에서 image 불러오기 웹사이트 랜딩 페이지에 swiper.js를 이용한 슬라이드 이미지, 제목, 내용을 admin에서 추가/수정할 수 있도록 하려고 한다 django admin에 모델을 추가하고 rest api에도 추가할 것이다 ① Pillow 설치 Pillow는 파이썬 이미징 라이브러리 여러 이미지 파일 포맷을 지원하고, 이미지 내부 데이타를 엑세스할 수 있게 하며 다양한 이미지 처리 기능을 제공한다 예를 들어, 이 패키지를 사용하면 Thumbnail 이미지를 만들다거나 다른 이미지 포맷으로 변환할 수 있고 이미지를 프린트하는 일들을 할 수 있다 또한, 이미지 크기를 변형하거나 회전 및 Transform, 그리고 필터링 등 다양한 이미지 프로세싱 작업들을 할 수 있다 pip3 install Pillow ② mall/mode..
[#. ETC] ERD(Entity Relationship Diagram) 개념 및 그릴 때 필요한 사이트 ERD를 그려야 할 때 보통은 프로그램을 설치해서 썼었다 최근에 ERD 그려야 할 일이 생겨서 서치하다가 발견했다 ERD 그리기 수월하고 편하다 ERD(Entity Relationship Diagram)란 개체-관계 모델 데이터 모델링 분야에서 개체-관계 모델이란 구조화된 데이터에 대한 일련의 표현이다 `구조`화된 데이터를 저장하기 위해 데이터베이스를 쓴다 이 데이터의 `구조` 및 그에 수반한 제약 조건들은 다양한 기법에 의해 설계될 수 있다 그 기법 중 하나가 개체-관계 모델링이다 개체(Entity) 실세계에 존재하는 다른 객체와 구별되는 유무형의 사물 개체를 설명하는 여러 속성들로 구성 관계(Relationship) 개체와 개체 사이의 연관성 속성 개체를 구체적으로 설명하는 특성 단순 속성과 복합 속..
[#. React] React functional 함수형 컴포넌트에서 const(arrow function) vs function 차이점 React Hook을 사용하는 함수형 컴포넌트에서 ① const(Arrow Function) import React from 'react'; const TestPage = () => { return( TEST ) } export default TestPage; ② Function import React from 'react'; function TestPage() { return( TEST ) } export default TestPage; 이렇게 두 가지로 사용하는 것을 볼 수 있다 이 두 가지 방식의 차이점이 궁금하다 ⑴ const const printThing = () => { console.log(`Random number : ${getRandom()}`) } printThing() const ge..
[#. React] Web/Mobile 웹/모바일 토글 메뉴바 toggle menubar 추가하기 네비게이션 바에 있는 메뉴를 웹에서는 펼쳐진 상태로 보고 모바일에서는 햄버거바 ☰ 형태로 접혀 있도록 하려고 한다 ① packages 설치 antd // UI Framework @ant-design/icons // UI Icon styled-components // scss react-device-detect // web/mobile device 구분 이렇게 설치해서 사용할 것이다 npm install --save antd npm install --save @ant-design/icons npm install --save styled-components npm install --save react-device-detect ② frontend/src/components/NavBar/NavBar.js imp..
[#. Django] Django(Rest Framework) + React로 Authentication 로그인/회원가입 구현하기 2 developer0809.tistory.com/98 [#. Django] Django(Rest Framework) + React로 Authentication 로그인/회원가입 구현하기 1 developer0809.tistory.com/92?category=895002 [#. Django] Django(Rest Framework) + React로 프로젝트 시작하기1 데이터 시각화를 위해 Python을 사용해야 하는데 그 중에서도 Django framework를 사용하고 싶.. developer0809.tistory.com 이전 글에서 backend에서 세팅은 했으니 이제 React에서 로그인/회원가입 페이지와 로그아웃을 구현해 보자 현재 구조는 이렇다 ① frontend/src/App.js import {R..
[#. Django] Django(Rest Framework) + React로 Authentication 로그인/회원가입 구현하기 1 developer0809.tistory.com/92?category=895002 [#. Django] Django(Rest Framework) + React로 프로젝트 시작하기1 데이터 시각화를 위해 Python을 사용해야 하는데 그 중에서도 Django framework를 사용하고 싶다 또한 Back/Front 분리를 위해 front는 React를 사용하려고 한다 React에서는 axios로 Django로부터 Rest API로 데.. developer0809.tistory.com 이전 글에서 세팅해둔 상태에서 이어서 진행하겠다 django react 프로젝트에서 로그인/회원가입을 구현해 보자 처음에는 아래 글을 보고 djangorestframework-jwt를 이용해서 로그인/회원가입을 구현하려고 했으..

티스토리툴바