Bleeding edge

https://school.programmers.co.kr/learn/courses/30/lessons/12914# 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 피보나치 수열이라는 것을 알기까지 시간이 좀 걸렸다. 1부터 5까지의 케이스를 나타내보겠다. 1(1) 11(2) 2(2) 111(2+1) 12(1+2) 21(2+1) 1111(3+1) 112(2+2) 121(3+1) 211(3+1) 22(2+2) 11111(4+1) 1112(3+1) 1121(4+1) 1211(4+1) 2111(4+1) 122(3+2) 212(3+2) 221(4+1) 괄호를 쳐서..

★★★★★ 1. 브라우저 렌더링 원리 1-1.홈페이지가 사용자에게 보이는 순서에 대해 설명해 주세요 더보기 주소창에 입력된 주소를 통해 서버를 찾아간다. 이후 DNS가 연결해줄 곳을 찾는다.(실제 서버) 서버에서 HTML 파일을 클라이언트로 보낸다. HTML 문서는 파싱되어 DOM을 생성한다.(객체 형식) 중간에 css를 로드한다. link 혹시 style 태그를 만나면 DOM 생성을 중지한다. CSS를 파싱하고 CSSOM을 생성한다. 이렇게 만들어진 DOM과CSSOM은 렌더링(브라우저에 시각적으로 출력하는 것)을 위해 렌더 트리로 결합된다. 만약 script 태그를 만나면, css와 동일하게 JS코드를 실행하기 위해 파싱을 중단한다. 이후 JS엔진을 실행하고 JS코드를 파싱한다. 2. 호이스팅에 대해서..

img에 width와 height를 주면 속도가 빨라진다 일종의 will change가 될 수 잇다 [class*="tittle"] .appMain [class^="__summary"]{ }캐럿기호 등등 어떻게 다른지 체크할 것 .iframeWrapper { position: relative; padding-top: 56%; width: 100%; height: 0; } .iframeWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } padding은 width를 기준으로 계산된다 .iframeRatio-4-3{ padding-top:75% } .iframeRatio-16-9{ padding-top:56.25 }

https://school.programmers.co.kr/learn/courses/30/lessons/64061 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 처음에 봤을 때 이 문제가 레벨1이라니! 하고 놀랬었던 문제.. 지금 와서 보니 레벨 1 맞는거 같은게 엄청 크게 고민해야할 것보다는 구현 로직이 상당히 심플하다. 단지 2차원을 쓰는게 익숙하지 않아서 어렵다고 생각이 들었던거 같다. 문제 로직은 상당히 심플하다 board와 move 두가지가 주어진다. 1. board에 있는걸 move에 있는 순서대로 한개씩 0으로 만들어준다. 2. 0으로 만든 ..

https://school.programmers.co.kr/learn/courses/30/lessons/67256 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 별로 좋아하는 방식은 아니지만 하드코딩을 이용하여 풀었다. 1-1 x, y에 알맞게 번호와 문자를 배치한다. 1-2 return할 result를 만든다. 1-3 left와 right의 초기값을 만든다 const list = { 1:[0,0], 2:[0,1], 3:[0,2], 4:[1,0], 5:[1,1], 6:[1,2], 7:[2,0], 8:[2,1], 9:[2,2], "*":[3,0], 0:[3..

https://school.programmers.co.kr/learn/courses/30/lessons/92334# 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제에서 캐치해야할 것은 두가지다 1. 신고를 하면 신고 받은 횟수를 저장한다.(중복은 안된다 신고는 한번 유효하다) 2. 유저가 신고를 받은 횟수가, k번을 넘어가면 정지가 되고, 신고했을 때 신고한 사람들은 신고해서 정지를 먹인 사람들의 숫자를 만드는 리스트를 만든다 1. 일상생활로 예시를 들면, 내가 신고해서 정지를 먹은 자동차가 몇개일까..? 알아보는 문제같다고 생각이 들었다. 문제 풀이..

1. XML의 목적: XML은 데이터를 저장하고 전달할 목적으로 만들어졌으며, 저장되는 데이터의 구조를 기술하기 위한 언어입니다 (단, 요즘은 XML보다는 JSON을 더 많이 사용합니다) 서로 호환되지 않는 데이터타입을 교환하는 과정에서, 데이터의 손실이 발생하는 경우가 종종 있지만, XML은 데이터를 텍스트로 저장하므로, 소프트웨어나 하드웨어에 독립적으로 데이터를 전달할 수 있습니다. (운영체제, 프로그램 브라우저 등 매체 상관없이 데이터를 안전하고 쉽게 전달이 가능하다) 2. XML의 생김새 //XML 문서는 첫줄에 태그를 이용하여 xml임을 밝혀야합니다. //version XML 버전 //encoding XML 문서의 문자셋을 이야기(default value = UTF-8) //standalone ..

이 글은 Vue와 Pinia를 사용하면서.. 시행착오가 많았었는데, 제가 다시 읽고 Pinia를 다시 사용할 때 편하기 하기 위해서 작성한 글입니다. 1. Pinia 생성 main.js import { createApp } from "vue"; import { createPinia } from "pinia"; import router from "./routes"; import App from "./App.vue"; import "./assets/styles/tailwind.css"; const app = createApp(App); app.use(createPinia()); app.use(router); app.mount("#app"); main.js에, router 앞에 createPinia를 사용한다..

요약: 1. 검색 가능한 이름을 써라 2. 함수명은 반드시 동사를 써라 3. 함수의 인수는 3개 혹은 그 이하로 사용해라 4. Boolean 값을 함수에 인수로 보내는 것을 최대한 방지하자 5. 짧은 변수명이나(아무도 이해못하는) 축약어 쓰는 것을 피하자 출처 : https://www.youtube.com/watch?v=Jz8Sx1XYb04&t=51s 1. 검색 가능한 이름을 써라 코딩을 하다보면 랜덤하게 값을 추가해야할 때가 있다. const SECONDS_IN_A_DAY = 86400; //하루의 시간이 몇 초인가 setInterval(functionName, SECOND_IN_A_DAY) 다른사람 혹은 미래의 내가 읽었을 때 특정 변수가 무엇인지를 알게되며, 그 함수가 무엇을 하는지 이해하기 쉽다...