목록전체 글 276
재밌고 어려운 IT를 이해해보자~!
Axios 란 ?특징운영 환경에 따라 브라우저간 XMLHttpRequest 객체 또는 Node.js의 HTTP API를 사용ES6 Promise API를 사용HTTP Methods를 사용Request의 응답을 자동으로 JSON 형태로 만듬jQuery의 Ajax처럼 클라이언트에서 서버로 데이터를 전달하며 요청하고 응답 받을 수 있다. import React,{ useEffect} from 'react'import axios from 'axios';function LandingPage() { useEffect(() => { axios.get('http://localhost:5000/api/hello') ,then(response => console.log(response.data)) }, []..
import csvmaxDay = 0maxYM = [0,0]deepestLen = 0.0deepestDate = ''with open('snow.csv','r') as file : data=csv.reader(file) for i in range(10): row = next(data) for a in range(10): for i in range(1, 13): if float(row[i]) > float(maxDay): maxDay = round(float(row[i])) maxYM[0] = row[0] maxYM[1] = i row = next(dat..
React Router Dom 이란?리액트를 사용할 때 페이지를 이동할 때 필요한 라이브러리이다.원래는 A페이지를 보여주고 싶다면 A.html파일을 이용하고 B페이지를 보여주고 싶다면 B.html 파일을 보여주는 방식이었다. 하지만 리액트에서는 웹 사이트의 전체 페이지를 하나의 페이지에 담아 동적으로 화면을 바꿔가며 표현한다.이것은 SPA(Single Page Application) 이라고 부른다. react-router-dom v6부터는,Switch 대신 Routes를 사용Route 안에 component 대신 element 사용 App.jsimport React from "react";import { BrowserRouter as Router, Routes, Route, Link} from ..
CRA 란 ?Create React App : Set up a modern web app by running one command.즉, 한 줄의 명령어를 입력함으로써 React 프로젝트 개발에 필수요소를 자동으로 구성하는 방법이다. BoilerPlate 코드모든 코드를 작성하기 위해 항상 필요한 부분을 의미한다. BoilerPlate는 다음 4가지로 구성되어 있다.Import : 필요한 코드를 불러들이는 부분Component : 현 페이지를 구현하는 코드StyleSheet : 페이지의 객체를 꾸미기 위한 styleExport : 현 Javascript 코드를 타 Javascript에서 접근하기 위한 부분 React 학습을 위해 정리한 폴더 구조 Code Extension 사용법 위처럼 마켓에 rea..
# 2018년도 0~9세 가장 적은 지역import csvminNum=0area=''with open('test02.csv','r') as file : data=csv.reader(file) header = next(data) pivot = next(data) minNum = int(pivot[3].replace(',','')) for row in data : row[3] = int(row[3].replace(',','')) if minNum > row[3] : minNum = row[3] area = row[0]print(area)print(str(minNum)+'명')# 2018년도와 2023년도를 비교했을때,..
ReactReact Js 란 페이스북 에서 만든 라이브러리 이며 2013년에 만들어졌다.Components로 이루어져있으며 모듈과 비슷하게 재사용성이 뛰어나다또한 Virtual DOM 이라는 것을사용하는데 Real DOM 과는 다르게 어떤 리스트중 1개가 수정되면 Real DOM의 경우 전부 Reload 해야하지만Virtual DOM은 해당 부분만 DOM에서 바꿔준다!-> Virtual DOM에서 전체를 기억 후 바뀐부분에 대해서만 Real DOM에서 바뀔 수 있도록 진행 Babel최신 자바스크립트 문법을 지원하지 않는 브라우저들을 위해서 최신 자바스크립트 문법을 구형 브라우저에서도 돌수있게 변환 시켜줌 Webpack복잡하게 이루어진 웹사이트에 대해서 bundle을 만들어주는 역할 많은 모듈들을 합해서 ..
파일 입출력 파이썬 언어 특성상, 파일을 읽어드리는 경우가 매우 많음 데이터 => 파일 => 분석, 가공, 시각화 단어맞추기 게임!line = ''tried = 0word =''temp = ''file=open('quiz.txt', 'rt')while True: line=file.readline() if line == '' : break word = linefile.close()print("단어를 맞춰라~")answer= ""for i in range (len(word)) : temp = temp + "_"temp = list(temp)while True: tried += 1 print(''.join(temp),end="") answer = i..
logout 기능을 만들기위해 logout Router를 만들고로그아웃하려는 유저를 데이터베이서에서 찾아 해당 유저의 토큰을 지운다.토큰을 지우는 순간 인증이 안되기 때문에 로그인 기능이 풀려버린다. app.get('/api/users/logout', auth, (res, req) => { User.findOneAndUpdate({ _id: req.user._id }, { token: "" } , (err, user) => { if (err) return res.json({ success: false, err }); return res.status(200).send({ success: true }) })})