본문 바로가기

분류 전체보기443

[백준 11724번] 연결 요소의 개수 n, m = map(int,input().split()) count = 0 graph = [[] for _ in range(n+1)] visited = [False]*(n+1) for _ in range(m): x, y = map(int,input().split()) graph[x].append(y) graph[y].append(x) def dfs(graph,v,visited): if visited[v]: return False visited[v] = True for i in graph[v]: if not visited[i]: dfs(graph,i,visited) return True for i in range(1,n+1): if dfs(graph,i,visited): count += 1 print(co.. 2023. 2. 15.
[CSS] React Component CSS 스타일링 기본 React does not have an opinion about how styles are defined. 리액트 공식 문서에 따르면 리액트는 명확한 스타일링에 대한 가이드를 제공하지 않습니다. 왜냐하면 현재 CSS 기술 자체가 사용되는 방식이 워낙 다양하기 때문입니다. 그렇다면 React 컴포넌트를 스타일링하는 기본적인 방법들을 소개해보도록 하겠습니다. 1) Inline Style import React from "react"; const btnStyle = { color: "white", background: "teal", padding: ".375rem .75rem", border: "1px solid teal", borderRadius: ".25rem", fontSize: "1rem", line.. 2023. 2. 14.
[CSS-in-JS] Styled Component의 개념 및 사용법 1) CSS in JS 복습 CSS in JS는 스타일 정의를 CSS 파일이 아닌 JavaScript로 작성된 컴포넌트에 바로 삽입하는 스타일 기법입니다. 기존에 웹사이트를 개발할 때는 HTML과 CSS, JavaScript는 각자 별도의 파일에 두는 것이 best practice로 여겨졌었습니다. 하지만 React나 Vue, Angular와 같은 모던 자바스크립트 라이브러리가 인기를 끌면서 웹개발의 패러다임이 바뀌고 있습니다. 최근에는 웹 애플리케이션을 여러 개의 재활용이 가능한 빌딩 블록으로 분리하여 개발하는 '컴포넌트 기반 개발 방법'이 주류가 되고 있습니다. 따라서, 웹페이지를 HTML, CSS, JavaScript 3개로 분리하는 것이 아니라, 여러 개의 컴포넌트로 분리하고, 각 컴포넌트에 HT.. 2023. 2. 14.
[백준 10026번] 적록색약 from collections import deque n = int(input()) # 영역(2차원 리스트) area = [] # 적록색약이 아닌 사람의 구역의 수 count_a = 0 # 적록색약인 사람의 구역의 수 count_b = 0 for _ in range(n): area.append(list(input())) # 적록색약 X 방문 여부 2차원 리스트 visited_a = [[False]*n for _ in range(n)] # 적록색약 O 방문 여부 2차원 리스트 visited_b = [[False]*n for _ in range(n)] # 적록색약 X BFS함수 def bfs_a(x,y): if visited_a[x][y]: return False visited_a[x][y] = True q.. 2023. 2. 14.
[백준 7576번] 토마토 from collections import deque # 가로(m), 세로(n) m, n = map(int,input().split()) # 토마토가 담긴 상자(2차원 리스트) area = [] # 토마토가 존재하는 위치를 담는 리스트 exist_list = [] # 토마도가 모두 익는 최소 일수(정답) result = 0 # BFS 함수 def bfs(list): global result queue = deque(list) # 익을 수 있는 토마토가 다 익었을 때, 마지막 구역에 저장된 값 depth = 0 while queue: v = queue.popleft() nx = [-1,1,0,0] ny = [0,0,-1,1] for i in range(4): temp_x = v[0] + nx[i] temp.. 2023. 2. 14.
[React] useParams Hook의 사용법 1) useParams Hook 이란 ? The useParams hook returns an object of key/value pairs of the dynamic params from the current URL that were matched by the . Child routes inherit all params from their parent routes. useParams Hook은 와 일치하는 현재 URL에서 동적 매개변수의 key/value 쌍 객체를 반환합니다. 하위 경로는 상위 경로에서 모든 매개변수를 상속합니다. (출처 : React Router 공식 문서) 리액트에서 라우터 사용 시 파라미터 정보를 가져와 활용하고 싶다면 React Router에서 제공하는 useParams라는 훅.. 2023. 2. 14.

티스토리툴바