짧은코딩

https://www.acmicpc.net/problem/1647 1647번: 도시 분할 계획 첫째 줄에 집의 개수 N, 길의 개수 M이 주어진다. N은 2이상 100,000이하인 정수이고, M은 1이상 1,000,000이하인 정수이다. 그 다음 줄부터 M줄에 걸쳐 길의 정보가 A B C 세 개의 정수로 주어지는데 A번 www.acmicpc.net 해결법 이 문제는 최소 비용을 구하는 문제이고 신장 트리를 만들어야 하는 문제라서 크루스칼 알고리즘으로 풀어야 한다. 다만 유의할 부분은 임의의 두 집 사이에 경로가 항상 존재해서 길을 더 없앨 수 있기 때문에 길 유지비를 최소로 하려면 가장 큰 값을 가진 길 하나를 없애면 된다. 그렇기에 가장 작은 유지 비용을 가진 길부터 연결한다고 했을 때 가장 마지막에 ..

Switch Switch는 하나를 키면 다른건 꺼지듯이 위 코드에서는 반드시 3개 중에서 1개만 선택 가능하다. 즉 여러 개의 라우터 중에서 딱 하나의 라우터만 표시해준다. Route는 컴포넌트를 화면에 띄워주는 것이다. Redirect는 다른 페이지로 돌려준다. 위 코드에서는 url이 /로 끝나면 /login으로 돌려준다. 따라서 /이나 /login이면 path가 login이다. 을 해주지 않으니까 에러가 발생했었다. SPA 구동 방식 SPA는 url이 없다. 오로지 index.html만 사용한다. 그래서 url 뒤에 /하고 주소를 붙쳐주는 것은 History API 덕분이다. 그래서 History API를 이용해서 가짜 주소를 만들어 준다. 새로고침하면 주소는 프론트로 안가고 서버로 간다. 근데 서버..

text-overflow text-overflow는 글을 썼는데 줄이 넘치면 생략해주는 속성이다. -적용하기 위한 조건 1. 고정된 width 혹은 height가 있어야 한다. 2. overflow:hidden; 속성을 사용해서 영역을 감춰야 한다. 3. 아래줄로 내려가는 것을 막기 위해 white-space: nowrap 같은 속성을 줘야 한다. overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 80px; 이런식으로 사용 가능하다. 이미지 어둡게 만들기 filter: brightness(60%); 위 사진처럼 이미지를 어둡게 하기 위해서는 filter를 사용하면된다.

만드는 과정 이 세팅을 하는데 정말 4일은 사용한 것 같다. 제로초님의 강의를 보고 그대로 따라했지만 에러의 늪에서 벗어나지 못했다. 오류를 해결하니 다른 오류가 발생했다. 혹은 오타가 발생했는데 이를 모르고 시간을 날렸다. 처음엔 정말 열정을 가지고 이 강의를 들었다. 하지만 에러와 오타가 날 수강 환불로 이끌뻔했다(ㅠㅠ). 정말 마음을 다 잡고 다시 처음 강의부터 차근차근 해 나갔다. 물론 이 과정에서도 오류는 발생했다. 하지만 이전에 했을 때 보다는 쉽게 극복할 수 있었다. 이 과정을 따르면서 npx create-react-app이란 명령어에게 얼마나 감사한지 알게되었다. 물론 이 세팅이 npx create-react-app을 수동으로 하는 과정인 것은 마지막에 알았다. 이걸 알고 나서 너무 허무했..

box-shadow 그림자 속성을 줄 수 있다. 이 사진 밑쪽 처럼 그림자를 줄 수 있다. 원하는 방향 어디든 줄 수 있다. box-shadow: 0px 5px 5px -5px rgba(0, 0, 0, 0.4); 이렇게 사용할 수 있다. -참고 사이트 https://developer.mozilla.org/ko/docs/Web/CSS/box-shadow box-shadow - CSS: Cascading Style Sheets | MDN box-shadow CSS 속성은 요소의 테두리를 감싼 그림자 효과를 추가합니다. 쉼표로 구문해서 여러 그림자 효과를 입힐 수 있습니다. 박스 그림자는 요소에서의 수평수직 거리(오프셋), 흐릿함과 확산 developer.mozilla.org overflow-x overfol..

네트워크 분류 -LAN(Local Area Network) LAN은 사무실과 개인적으로 소유 가능한 규모이다. LAN은 근거리 통신망을 의미하고 캠퍼스 같은 좁은 공간에서 운영된다. 전송 속도가 빠르고 혼잡하지 않다. -MAN(Metropolitan Area Network) MAN은 서울시 같은 시 정도 규모이다. 대도시 지역 네트워크를 나타내고 도시 같이 넓은 지역에서 운영된다.전송 속도는 평균이고 LAN보다는 더 혼잡하다. -WAN(Wide Area Network) WAN은 세계 규모이며 광역 네트워크이다. 국가나 대륙 같은 더 넓은 지역에서 운영된다. 전송 속도는 낮고 MAN보다 더 혼잡하다. 네트워크 성능 분석 명령어 애플리케이션엔 문제가 없는데 데이터를 못 가져오는 경우가 있다. 이는 네트워크 ..

제로초님의 Slack 클론 코딩 프론트엔드 버전을 배우기 위해서 제로초님의 깃허브에 들어가서 먼저 다운을 받아줬다. 그리고 프론트엔드 개발을 하기 위해서 백엔드가 만들어져 있어야 하는데 백엔드는 제로초님이 이미 만들어 놓은 것을 이용할 예정이다. 기본 설치 프로그램 1. nodeJS 2. MySQL https://solbel.tistory.com/1475 깃허브 다운 후 해야 할 것 깃허브에서 파일을 다운하고 먼저 npm i npm을 설치를 하려고 했는데 에러가 발생했다. 정말 이것 저것 구글링 해봤지만 도저히 해결되지 않았다. 그러다가 nvm을 설치하고 node.js의 버전을 바꿔주니까 제대로 설치됐다.(한 2일 고생했다...) npx sequelize db:create 이 명령어를 통해 데이터베이스를..

html의 빈 박스에 막대나 원 만들기 -막대 width: 15px; height: 60px; background-color: white; -원 background-color: white; width: 15px; height: 15px; border-radius: 50%; 막대나 원 둘 다 반드시 width와 height를 줘야한다. 그리고 원은 border-radius에 50%을 주거나 width와 height의 절반 크기의 px를 줘야한다. keyframe -원형으로 돌리는 법 @keyframes turn { 100% { transform: rotate(180deg); } } rotate를 주면 된다. -각 아이템에 순서대로 애니메이션을 주는 법 1. 우선 keyframse를 만든다. 2. 각 아이템..

해결법 문제를 보고서 이 문제는 경로 압축으로 루트 노드를 찾는 함수를 팀 합치기 연산으로 사용한다. 그리고 루트 노드가 같은지 판단하는 함수를 같은 팀 여부 확인으로 풀었다. 코드(한번에 맞음) n, m = map(int, input().split()) def find_parent(parent, x): if parent[x] != x: find_parent(parent, parent[x]) return parent[x] def union(parent, a, b): a = find_parent(parent, a) b = find_parent(parent, b) if a < b: parent[b] = a else: parent[a] = b parent = [i for i in range(n+1)] answ..

데이터베이스(DataBase)는 일정한 규칙, 규약을 통해 구조화되어 저장된 데이터 모음이다. DBMS(DataBase Management System)는 DB를 제어, 관리하는 통합 시스템이다. DB 안에 있는 데이터들은 특정 DBMS마다 정의된 쿼리 언어(query language)를 통해 삽입, 삭제, 수정, 조회 등이 가능하고 DB는 실시간 접근, 동시 공유가 가능하다. 예를 들어 MySQL이라는 DBMS가 있고 Node.js, php 같은 응용 프로그램에서 DB안에 있는 데이터를 꺼내 데이터 관련 로직을 구축할 수 있다. 엔티티(entity) 엔티티는 사람, 장소, 물건, 사건, 개념 등 여러 개의 속성을 지닌 명사를 의미한다. 엔티티는 서비스 요구 사항에 맞춰 속성이 정해진다. 만약 주소라는 ..