본문 바로가기

분류 전체보기

 (165)
공부기록, 2021-08-30(react 버튼) - react 버튼 ``` import React, { useState } from "react"; import { HashRouter as Router, Link, useParams } from "react-router-dom"; import { gql } from "apollo-boost"; import { useQuery } from "@apollo/react-hooks"; import styled from "styled-components"; import "../Components/css/styles.css"; const GET_MOVIE_INFO = gql` { movies { id title } } `; const MovieList = styled.div` margin-top: 10px; co..
공부기록, 2021-08-27(react atom) 되지 않고 atom의 값을 읽어야 하는 드문 경우는 useRecoilCallback()를 참조하면 된다. 정적인 값으로 atom을 초기화하거나 같은 유형의 값을 나타내는 Promise 또는 RecoilValue을 사용하여 원자를 초기화할 수 있다. 왜냐하면 Promise가 보류 중이거나 기본 selector가 비동기일 수 있기 때문에 atom의 값도 보류 중이거나 읽을 때 오류를 발생시킬 수 있다는 것을 의미한다. 현재 atom을 설정할 때 Promise을 지정할 수 없다는 점에 유의해야 한다. 비동기 함수를 사용하기 위해서는 selectors를 사용한다. atom은 Promise나 RecoilValues를 직접 저장하는 데 사용할 수 없지만 객체를 감쌀 수도 있다. Promises은 변경될 수 있다는 ..
공부기록, 2021-08-26(react selector) - react selector - key : selector를 구분할 수 있는 유일한 id, 즉 key 값을 의미합니다. - get : 에는 derived state 를 return 하는 곳 입니다. 예시 코드에서는 api call을 통해 받아온 data를 return 하게 됩니다. (해당 selector가 갖고 있습니다.) ``` const cookie = useRecoilValue(selector) ``` 다음과 같이 값을 조회할 수 있습니다. - set : writeable 한 state 값을 변경할 수 있는 함수를 return 하는 곳 입니다. 여기서 주의하실 점은, 자기 자신 selector를 set 하려고 하면, 스스로를 해당 set function에서 set 하는 것이므로 무한루프가 돌게 되..
공부기록, 2021-08-25(recoil useRecoilState) - recoil useRecoilstate - atom에서는 state, loadable에서는 state or conents snapshot 에서는 snapshot의 value에 접근하거나 value를 set 할 수 있는 함수를 불러올 수 있는 hook에 해당합니다. 하지만 우린 이들을 전역으로 관리하기 때문에, value만 필요한 컴포넌트도 있을 것이고, state를 변경하기만 하는 컴포넌트도 있을 것 입니다. 이를 위해 useRecoilState() 의 역할을 반으로 쪼개면(?) useRecoilValue() 과 useSetRecoilState() 로 나눌 수 있겠습니다. ``` import { useRecoilValue, useSetRecoilState } from 'recoil'; import {..
공부기록, 2021-08-24(recoil) - recoil 기본 - Atom은 상태(state)의 일부를 나타낸다. Atoms는 어떤 컴포넌트에서나 읽고 쓸 수 있다. atom의 값을 읽는 컴포넌트들은 암묵적으로 atom을 구독한다. 그래서 atom에 어떤 변화가 있으면 그 atom을 구독하는 모든 컴포넌트들이 재 렌더링 되는 결과가 발생할 것이다. - Selector는 파생된 상태(derived state)의 일부를 나타낸다. 파생된 상태는 상태의 변화다. 파생된 상태를 어떤 방법으로든 주어진 상태를 수정하는 순수 함수에 전달된 상태의 결과물로 생각할 수 있다.
공부기록, 2021-08-23(react) - recoil Selector 저장 ``` const colorCounterState = selector({ key: "colorCounterState", get: ({ get }) => { let counter = { [COLORS.RED]: 0, [COLORS.BLUE]: 0, [COLORS.WHITE]: 0 }; for (let i = 0; i { for (let i = 0; i < BOX_NUM; i++) { set(boxState(i), COLORS.WHITE); } } }); ```
공부기록, 2021-08-20(html 로딩이미지) - html 로딩이미지 ``` Loading ... 일단, 위와 같이 로딩 이미지를 태그내에 위치시키고 아이디를 loading_image 라구 명명합니다 그리고, 페이지 하단부분에 아래와 같이 코드를 넣어주면 됩니다 이렇게 하면, 페이지 로딩이 모두 완료된 이후에 로딩바가 사라지게됩니다 ``` ## 자주 하는 실수 - 기본기능으로 때우려고함 ## 큐 - 어차피 헷갈리니 자주보고쓰자 ## 내가 모르는 것 - html 로딩이미지
공부기록, 2021-08-19(html 크롤링) - html 크롤링 ``` from urllib.request import urlopen from bs4 import BeautifulSoup import re import datetime import random pages = set() random.seed(datetime.datetime.now()) # 페이지에서 발견된 내부 링크를 모두 목록으로 만듭니다. def getInternalLinks(bsObj, includeUrl): internalLinks = [] # /로 시작하는 링크를 모두 찾습니다. for link in bsObj.findAll("a", href=re.compile("^(/|.*"+includeUrl+")")): if link.attrs['href'] is not None: if..

티스토리툴바