본문 바로가기

공부65

장고 템플릿 공부중.. extends 2021. 8. 18.
Django-environ Welcome to Django-environ’s documentation! — Django-environ 0.4.4 documentation Value from environment or default (if set) django-environ.readthedocs.io 설치 pip install django-environ #settings.py from pathlib import Path import os, environ env = environ.Env( # set casting, default value DEBUG=(bool, False) ) # Build paths inside the project like this: BASE_DIR / 'subdir'. BASE_DIR = Path(__file_.. 2021. 8. 17.
장고 공부 1. django-admin startproject mysite 이 명령은 현재 디렉토리에서 mysite라는 디렉토리를 생성할 것입니다. 만약 이 명령이 동작하지 않는다면, django-admin을 실행하는 데 문제가 있습니다.를 확인하세요. 2. python manage.py startapp users //manage.py가 있는 디렉토리에서 사용 Django에서 당신이 작성하는 각 어플리케이션들은 다음과 같은 관례로 Python 패키지가 구성됩니다. Django 는 앱(app) 의 기본 디렉토리 구조를 자동으로 생성할 수 있는 도구를 제공하기 때문에, 코드에만 더욱 집중할 수 있습니다. 앱을 만들었으면 처음 만들었던 mysite의 settings에서 INSTALLED_APPS 에 아래처럼 app을 추.. 2021. 8. 17.
react hook react component 는 class component 와 functional component로 나뉜다. class component 더 많은 기능을 제공 대신에 코드가 더 길어지고 성능적으로 조금 더 느려진다고 한다. functional component 제공하는 기능이 한정해지만 코드가 짧아지고 성능적으로도 더 좋아진다. 리액트 라이프 사이클 React Lifecycle Methods diagram Fully interactive and accessible React Lifecycle Methods diagram. projects.wojtekmaj.pl functional component에서는 라이프 사이클 대부분을 사용할 수가 없다 그래서 나온 게 react hook 이라고 한다. reac.. 2021. 6. 15.
redux redux는 상태 관리 라이브러리다 Redux is a predictable state container for javascript apps props 와 state props는 properties의 줄임말 부모 컴포넌트가 있으면 자식 컴포넌트가 들어갈 수 있는데 그럴 때 props 를 이용한다 그리고 위에서 아래로 부모 컴포넌트에서 자식 컴포넌트로 이렇게만 보낼 수가 있다. 또 부모 컴포넌트에서 자식 컴포넌트에게 1이라는 데이터를 줬다고 하면 자식 컴포넌트에서는 1이라는 데이터를 바꿀 수 없다. 그래서 부모에서 변경한다음 다시 자식에게 보내야함 state 부모 컴포넌트에서 자식 컴포넌트에게 데이터를 보내는 게 아니고 그 컴포넌트 안에서 데이터를 바꿀 수 있다. 데이터가 바뀔 때 재 렌더링 된다. sta.. 2021. 6. 15.
ant design 이용 다운로드 npm install antd --save 사용할 것을 component 탭에서 Ant Design - The world's second most popular React UI framework ant.design 위 사이트로 가서 getStarted에 들어가면 사용법이 자세하게 나와 있습니다. react의 index.js에 아래 코드를 추가해줘야함 import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' 2021. 6. 15.
CSS 리액트 프레임워크 1. Meterial UI Material-UI: A popular React UI framework React components for faster and easier web development. Build your own design system, or start with Material Design. material-ui.com 2. React Bootstrap React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io 3. Sementic UI Introduction - Semantic UI React Semantic UI React is the official React in.. 2021. 6. 15.
Concurrently 이용 npm install concurrently --save 프론트, 백엔드 서버 한번에 켜기 사용 방법 concurrently Run commands concurrently www.npmjs.com 루트 디렉토리의 pakage.json 에 dev를 추가해 주었고 "concurrently \" 경로 \" \" 경로\"" "scripts": { "start": "node index.js", "backend": "nodemon index.js", "test": "echo \"Error: no test specified\" && exit 1", "dev": "concurrently \"npm run backend\" \"npm run start --prefix client\"" }, 2021. 6. 15.
데이터 Flow Axios Cors Proxy npm install axios --save //localhost:3000 import React, {useEffect} from 'react' import axios from 'axios'; import { response } from 'express'; function LandingPage() { useEffect(() => { axios.get('http://localhost:5000/api/hello') .then(response => console.log(response.data)) }, []) return ( 랜딩페이지 ) } export default LandingPage //localhost:5000 app.get('/api/hello', (req, res) => { res.send('안녕.. 2021. 6. 15.
리액트 라우터 돔 다운로드 npm install react-router-dom --save https://reactrouter.com/web/example/basic path : 는 URL이 된다. exact을 붙혀줘야함 2021. 6. 15.