짧은코딩

콘솔에 localStorage.setItem("username", "nico") 입력하면 어플리케이션에 이렇게 저장된다. localStorage.getItem("username") localStorage.removeItem("username") 이런 명령어로 가져올 수도 있고 삭제할 수도 있다. const loginForm = document.querySelector("#login-form"); const loginInput = document.querySelector("#login-form input"); const greeting = document.querySelector("#greeting"); const HIDDEN_CLASSNAME = "hidden" function onLoginSumbit(..

https://www.acmicpc.net/problem/1766 1766번: 문제집 첫째 줄에 문제의 수 N(1 ≤ N ≤ 32,000)과 먼저 푸는 것이 좋은 문제에 대한 정보의 개수 M(1 ≤ M ≤ 100,000)이 주어진다. 둘째 줄부터 M개의 줄에 걸쳐 두 정수의 순서쌍 A,B가 빈칸을 사이에 두고 주 www.acmicpc.net 참고한 사이트 https://freedeveloper.tistory.com/390 [이것이 코딩 테스트다 with Python] 36강 위상 정렬 4https://www.youtube.com/watch?v=xeSz3pROPS8&list=PLVsNizTWUw7H9_of5YCB0FmsSc-K44y81&index=36 위상 정렬 사이클이 없는 방향 그래프의 모든 노드를 방..

https://www.acmicpc.net/problem/7662 7662번: 이중 우선순위 큐 입력 데이터는 표준입력을 사용한다. 입력은 T개의 테스트 데이터로 구성된다. 입력의 첫 번째 줄에는 입력 데이터의 수를 나타내는 정수 T가 주어진다. 각 테스트 데이터의 첫째 줄에는 Q에 적 www.acmicpc.net 내 풀이(구글링해서 찾아보고 안보고 풀음) import heapq t = int(input()) rst = [] for i in range(t): n = int(input()) chk = [False]*1_000_001 max = [] min = [] for j in range(n): x = list(input().split()) if x[0] == 'I': heapq.heappush(max,..

Log In const loginForm = document.getElementById("long-form"); const loginInput = loginForm.querySelector("input"); const loginButton = loginForm.querySelector("button"); 이런 방법으로 html의 버튼을 js에서 가져올 수 있다. const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelector("#login-form button"); 이렇게 하면 코드를 더 줄일 수 있다. const loginInput = document.querySelector(..

console.dir()에서 on이 앞에 붙어있는 것은 이벤트이다. const title = document.querySelector("div.hello:first-child h1"); function handleMouseEnter(){ console.log("mouse is here!"); } title.addEventListener("mouseenter", handleMouseEnter) 마우스 위로 올라가면 콘솔에 뜬다. const title = document.querySelector("div.hello:first-child h1"); function handleTitleClick() { title.style.color = "blue"; } function handleMouseEnter(){ ti..

https://programmers.co.kr/learn/courses/30/lessons/42576 코딩테스트 연습 - 완주하지 못한 선수 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수 programmers.co.kr 내 풀이(힌트 보고 맞춤) def solution(participant, completion): answer = '' participant.sort() completion.sort() for i in range(len(participant)): if i > len(completion) - 1: answer = participant[i] bre..

const age = prompt("How old are you?"); console.log(typeof "15", typeof parseInt("15")); prompt 입력창을 띄워주지만 구방식이라 요즘엔 안쓴다 typeof 타입형을 판단해 출력 parseInt 문자열을 int형으로 바꿔준다 const age = parseInt(prompt("How old are you?")); console.log(age); 입력을 int로 바꿔서 해준다. const age = parseInt(prompt("How old are you?")); console.log(isNaN(age)); isNaN()은 is Not a Number 이란 뜻 논리 연산자 and: && or: || document, dir docum..

변수 const는 업데이트를 할 수 없다. let는 업데이트 가능, 한번만 쓰면 그 다음부턴 타입을 안써도 된다. =>const가 기본, let 가끔, var는 쓰면 안됨 객체 클래스 같은 느낌 const player={ name:"nico", points:10, fat:true }; console.log(player); console.log(player.name); console.log(player["name"]); // 이건 nico 나옴 함수 function sayHello(nameOfPerson){ console.log("Hello my name is " + nameOfPerson); } sayHello("nico"); sayHello("dal"); sayHello("lynn"); const pl..

미디어 쿼리는 반응형 웹사이트를 구현하는 기능이다. 화면이 커지거나 작아짐에 따라서 사용자의 화면에 보이는 것이 달라지게 할 수 있는 기능이다. 이렇게 보이던 페이지가 이렇게 나타날 수 있다. -코드 @media(max-width:600px){ #grid{ display: block; grid-template-columns: 200px 1fr; } ol{ border-right:none; } h1{ border-bottom: none; } } @media()라는 것을 이용하여 기능을 구현할 수 있다. max-width:600px라는 것은 가로 길이가 600px 미만일 때 아래 코드를 적용하라는 것이다. 아래 코드에서는 줄을 없어지게 하는 명령어를 통해 반응형 사이트를 구현했다.

이 사이트에서 왼쪽에 메뉴를 두고 오른쪽에 내용이 나오도록 했다. 그러기 위해서는 grid라는 기능을 이용해서 나눴다. -코드 #gird ol{ padding-left:52px; } #grid{ display: grid; grid-template-columns: 200px 1fr; } #grid #article{ padding: 25px; } 왼쪽 메뉴를 ol로 구현했고 #grid로 ID로 구현했다. -#grid ol에서는 메뉴에서 위치 조절을 해줬다. -#grid에서는 grid-template-columns는 왼쪽을 200px로 구현하고 1fr는 전체칸을 차지한다. 만약 2fr 1fr으로 했다면 전체를 3fr로 두고 왼쪽이 2fr을 차지하고 오른쪽 1fr을 차지한다. -#grid #article에서는 ..