분류 전체보기 검색 결과

해당 글 777건

JS 사용자를 위한 python 정리

3.8.2 Documentation Python 3.8.2 문서 환영합니다! 파이썬 3.8.2 설명서의 한국어 번역입니다. 설명서의 파트들: 파이썬 3.8 의 새로운 기능은? 2.0 이후의 모든 "새로운 기능" 문서 자습서 여기에서 시작하세요 라이브러리 레퍼런스 베개 밑에 넣어 두세요 언어 레퍼런스 문법과 언어 요소들을 설명합니다 파이썬 설정 및 사용법 여러 플랫폼에서 파이썬을 사용하는 법 파이썬 HOWTO 특정 주제에 대한 심층적인 문서 파이썬 모듈 설치하기 파이썬 패키지 색인 및 기타 docs.python.org JS를 기본으로 python이 가진 특성에 대해 정리해보았다. 전에 python을 이용해서 pandas와 graph 패키지를 통해 CSV를 가공한 경험이 있는지라 바닥부터 배우기에는 시간이 ..
Programming Language/🐍 Python 2020. 4. 20. 04:06

python 환경 변수 세팅, python 경로 찾기

MySQL나 MongoDB를 사용할 때 환경 변수에 설정하여 cmd 창에서 활용하기 위해 해당 설치 파일의 bin 폴더를 환경 변수에 설정한 경험이 있을 것이다. python은 설치 시에 Add Python 3.xx to PATH 항목에 체크만 하면 자동으로 추가해주지만 체크하지 않은 경우에는 직접 등록해줘야 한다. 환경 변수는 여러 상황에서 사용해보았을 터이므로 간단히 캡쳐본만 첨부한다. 참고로 위는 특정 사용자에게만 적용될 변수이고 하단 시스템 변수는 모든 사용자에게 적용될 변수이다. 일반적으로 유저를 분리해서 사용할 경우는 적으므로 시스템 변수의 path에 추가해주자. 일반적인 python 설치 경로는 다음과 같다. C:\Users\[사용자 이름]\AppData\Local\Programs\Pytho..
Programming Language/🐍 Python 2020. 4. 19. 05:14

useCallback과 useRef를 이용한 infinite Scrolling

정리 중입니다 import React, { useEffect, useState, useCallback, useRef } from "react"; import ReactDOM from "react-dom"; import "./styles.css"; import { getMovies } from "./api"; const App = () => { const [page, setPage] = useState(1); const [movie, setMovie] = useState([]); const [loading, setLoading] = useState(false); const observer = useRef(); const lastMovieElementRef = useCallback( (e) => { if (..
React, Next, Redux/🚀 React with Hooks 2020. 4. 19. 02:16

react-slick을 이용한 캐러셀 슬라이더

antd의 슬라이더가 react-slick을 기반으로 만들어졌습니다. 결국은 slick으로 돌아왔습니다. 이제는 제가 직접 만든 carousel을 사용합니다. 다운로드 수가 상당히 많다. 일반 HTML 환경에서 jQuery를 사용할 수도 있겠다만 여기서는 React-slick을 살펴보도록 하자. react-slick React port of slick carousel www.npmjs.com 공식 문서에서 참고하여 간단한 슬라이드를 만들어보았다. 아래 점을 커스터마이징했는데, 그냥 일반적인 함수형 컴포넌트이다. import React from "react"; import Slider from "react-slick"; import styled from "styled-components"; export d..
React, Next, Redux/⚛ React.JS 2020. 4. 18. 04:20

바닐라 JS로 Carousel Slider 만들기

Carousel(캐러셀)의 본 의미는 회전목마, 수화물 컨베이어 벨트를 말한다. 무슨 슬라이더를 의미하는지 감이 올 것이다. 캐러셀 슬라이더를 구현하는 jQuery가 존재하지만 (Slick을 추천) 아주 가벼운 웹을 만들거나 간단한 웹을 만든다면 바닐라 JS로 구현해보는 것도 나쁘지 않을 것이다. 🧷 기본 HTML/CSS/JS 기본 아이디어는, 해당 리스트 중에서 보이고 싶은 리스트에 showing 클래스를 줘서 z-index로 튀어나오게 만드는 것이다. 일정 시간이 지나거나 버튼을 누르면 기존 showing 클래스를 지우고 다른 곳에 showing 클래스를 생성하는 방식으로 이동한다. 1 2 3 4 5 🧷 React + Slick 다음 게시물에 slick pakage를 이용하여 슬라이더를 구현하는 방법..
Programming Language/🟨 Javascript 2020. 4. 18. 03:53

콜백 함수와 비동기제어

⚡ 콜백함수 콜백 함수는 다른 코드의 인자로 넘겨주는 함수입니다. 콜백 함수를 넘겨받은 코드는 적절한 시점에 콜백 함수를 실행합니다. 굳이 콜백 함수라고 말해서 어렵게 느껴질 수도 있지만 그냥 특정한 시점이나 이벤트에 반응해서 실행하는 함수를 말합니다. 콜백이라고 이름 붙인 이유는 callback 즉, 특정 이벤트나 시점에 자신을 불러달라고 하는 데에서 왔습니다. 그러니까 어렵게 생각하지 맙시다. 콜백 함수는 그냥 함수입니다. setTimeout(() => console.log("test"), 3000)) el.addEventListener("click", () => setCount(count + 1)) 콜백 함수가 중요한 이유는 위와 같이 setTimeout, setInterval과 같이 대놓고 콜백 ..
Programming Language/🟨 Javascript (Core) 2020. 4. 17. 22:02

React Hooks : useEffect에서 데이터 fetching하기

How to fetch data with React Hooks? - RWieruch A tutorial on how to fetch data in React with Hooks from third-party APIs. You will use state and effect hooks for the data request from a real API ... www.robinwieruch.de 위 게시물을 근거하여 작성되었으며 기본적인 useEffect에 대해 알고 있다는 전제 하에 작성되었습니다. 🧷 useEffect를 componentDidMount처럼 사용하기 즉, 처음 마운트 된 후 1번만 useEffect가 실행하게 하고 싶다는 의미이다. 이 경우 deps에 빈 배열을 주면 된다. 해당 배열의 의미는..
React, Next, Redux/🚀 React with Hooks 2020. 4. 16. 21:30

this(2) : 명시적으로 this를 바인딩하기

앞서 살펴본 this의 규칙을 깨고 this에 다른 대상을 바인딩할 수도 있습니다. call, apply, bind 메서드를 주로 사용하지만, 이러한 메서드를 사용하기보다 (가능하다면) 화살표 함수를 이용하는 것이 더 깔끔합니다. 일단 무엇이 있는지만 알아두도록 합시다. 요새 화살표 함수가 일반 함수를 대체할 수 없다는 것을 통감하고 있습니다. 때에 따라 적절한 방식의 함수를 사용합시다. ㅜㅜ * 함수에 call, apply, bind와 같은 메서드를 정의한 적이 없음에도 사용할 수 있는 이유는 이 메서드들이 prototype에 정의된 메서드들이기 때문입니다. 프로토타입에 대해서는 이후에 다루도록 하겠습니다. call 메서드 call 메서드는 호출하는 함수의 첫 인자를 this로 바인딩합니다. 이후의 인..
Programming Language/🟨 Javascript (Core) 2020. 4. 15. 20:37