뇌 채우기 공간

styled-components를 사용하기 터미널에서 yarn add styled-components로 패키지를 설치해준다. App.js 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 import React from 'react'; import logo from './logo.svg'; // BucketList 컴포넌트를 import 해옵니다. // import [컴포넌트 명] from [컴포넌트가 있는 파일경로]; import BucketList fro..

코드를 확인하자! 더보기 App.js import React from "react"; import logo from './logo.svg'; import './style.css'; import Start from "./Start"; class App extends React.Component{ constructor(props){ super(props); this.state = { name: "꼬미" }; } render () { return ( ) } } export default App; Start.js import React from 'react'; import img from "./scc_img.jpg"; const Start = (props) => { console.log(props); // 컴포..

App.js 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 import React from 'react'; import logo from './logo.svg'; import './App.css'; // BucketList 컴포넌트를 import 해옵니다. // import [컴포넌트 명] from [컴포넌트가 있는 파일경로]; import BucketList from './BucketList'; // 클래스형 컴포넌트는 이렇게 생겼습니다! class App extends React.Component { constructor(props){ super(props); // App 컴포넌트의 state를 정..

■ 함수형 컴포넌트 BucketList.js 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 // 리액트 패키지를 불러온다. import React from 'react'; // 함수형 컴포넌트는 이렇게 쓸 수도 있고 // function Bucketlist(props){ // return ( // 버킷 리스트 // ); // } // 이렇게 쓸 수도 있다.. =>가 들어간 함수를 화살표 함수라고 한다. // ()안에 props는 부모 컴포넌트부터 받아온 데이터다. // 얘의 부모가 누구냐? const BucketList = (props) => { // 컴포넌트가 뿌려줄 ui 요소(리엑트 엘리먼트)를 반환한다. return ( 버..

■ Component란? 리액트는 레고! 컴포넌트는 블록! 웹사이트를 조각내자 컴포넌트를 이해하고 잘 써먹으려면 웹 사이트를 잘 조각낼 줄 알아야한다. 이 페이지를 만든다고 생각해보자 간단하게 1. 2. 1. 2. 3. 이렇게 조각으로 나눌 수 있다. 이렇게 나눈 조각 하나하나를 컴포넌트라고 부른다. header컴포넌트, container컴포넌트, footer컴포넌트가 있고 container컴포넌트 안에는 imagebanner컴포넌트, contests1컴포넌트가 있다. Component는 웹 사이트의 조각이고, 우리는 이 조각을 모아서 웹 사이트에 뿌려준다. ◎ Component에서 데이터 관리는 어떻게 하는가? state state는 component가 가지고 있는 데이터이다. 해당 컴포넌트에서만 사용..

■ CRA가 무엇인가? React는 레고같은 친구이다. 레고로 성을 만드는 것 처럼 우리는 리액트를 사용해서 웹 사이트를 만든다. 레고는 네모 블록, 긴블록 등등 자기가 원하는 것을 따로 살 수 있다. 리액트도 마찬가지로 자신이 필요한 것들을 하나씩 설치할 수 있다. 그런데 레고로 하나씩 구매하기 귀찮으면 해리포터 성만들기 같은 패키지를 사는 것처럼 CRA는 웹사이트를 만들때 필요한 것을 몽땅 넣어서 만든 패키지이다. ■ JSX란? 리액트에는 딱 하나의 html파일만 존재한다. (public 폴더안에 있는 index.html) 그럼 리액트에서는 어떻게 뷰를 그리냐? JSX문법을 이용해서 React요소를 만들고 DOM에 렌더링 시켜서 그린다. HTML을 품은 JS === JSX 이다. HTML태그는 .js..

https://wings2pc.tistory.com/entry/%EC%9B%B9-%EC%95%B1%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%B0%8D-%ED%8C%8C%EC%9D%B4%EC%8D%AC-%ED%94%8C%EB%9D%BC%EC%8A%A4%ED%81%ACPython-Flask-%EC%84%A4%EC%B9%98-%EB%B0%8F-%EC%9B%B9-%EC%95%A0%ED%94%8C%EB%A6%AC%EC%BC%80%EC%9D%B4%EC%85%98Web-Application-%EC%8B%9C%EC%9E%91

num = 3 if num %2 == 0: result = '짝수' else: result = "홀수" result = ('짝수' if num % 2 == 0 else '홀수')

def say_hi(): print('안녕!') def say_hi_to(name): print(f'{name}님 안녕하세요') fuction들을 이렇게 만들어 놓은 파일 main_func.py from main_func import * say_hi() say_hi_to('영수') 다른 파일에서 불러서 쓰려면 이렇게 쓴다

import requests from bs4 import BeautifulSoup url = 'https://movie.naver.com/movie/bi/mi/basic.nhn?code=171539' headers = {'User-Agent' : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36'} data = requests.get(url,headers=headers) soup = BeautifulSoup(data.text, 'html.parser') # 여기에 코딩을 해서 meta tag를 먼저 가져와보겠습니다. # 이 방법대로 하면 안나옴 # t..