분류 전체보기
-
[React] React + DOM vs Virtual DOMWeb/React 2024. 11. 27. 17:31
리액트(React)를 왜 사용할까?가장 인기있는 프레임워크강력한 커뮤니티와 광범위한 생태계강력한 커뮤니티광범위한 생태계하나를 배우면 모바일 앱까지돔(DOM) vs 가상 돔(Virtual DOM)돔(DOM)이란?가상 돔(Virtual DOM)이란?강력한 컴포넌트 기능- 리액트(React)를 왜 사용할까? 리액트는 왜 사용할까? 왜 인기가 많을까?- 가장 인기 있는 프레임워크 React는 주간 다운로드가 항상 2천만을 넘어갈 정도로 매우 인기가 많다. 특히, 국내 기업 인지도면에서 React가 가장 많은 인지도를 가지고 있다. (다음은 Vue.js)- 강력한 커뮤니티와 광범위한 생태계 1. 강력한 커뮤니티React는 국내외로 인기가 많은 프레임워크이기 때문에 매우 큰 커뮤니티를 보유하고 있다. 이에 따라 풍..
-
[Web] 웹 스타일링 도구 (CSS, CSS Modules, SCSS, Tailwind CSS, Styled-components)Web/Web 2024. 11. 26. 17:39
CSSCSS ModulesSCSS (+ Sass)Tailwind CSSStyled-components요약웹 개발에서 스타일링은 단순히 보기 좋은 화면을 만드는 것을 넘어, 사용자의 경험을 향상시키고브랜드의 가치를 표현하는 중요한 요소이다. 다양한 스타일링 방법 중에서 CSS, CSS Modules, SCSS, Tailwind CSS, Styled-components는각각의 장단점과 활용 방식으로 주목받고 있다. 이번 포스팅에서는 이들 스타일링 도구와 방법을 비교하며, 상황에 맞는 선택을 할 수 있도록 탐구해 보려 한다.- CSS CSS는 Cascading Style Sheets의 줄임말이며,전통적인 스타일링 언어로, HTML 요소의 스타일을 정의한다. 정적 스타일링 방식으로, 아래와 같은 방식을 따른다...
-
[프로그래머스 Level 1] 폰켓몬 (JavaScript)Coding Test/JavaScript 2024. 11. 25. 17:17
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/1845 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예numsresult [3,1,2,3] 2 [3,3,3,2,2,4]3 [3,3,3,2,2,2]2 풀이function solution(nums) { const setArr = new Set(nums); return Math.min(setArr.size, nums.length/2);} 함수 solution은 한 개의 매개변수를 받는다. 1. 폰켓몬의 종류를 나타내는 숫자들이 포함된 배열 = nums 이 문제의 ..
-
[프로그래머스 Level 1] 카드 뭉치 (JavaScript)Coding Test/JavaScript 2024. 11. 25. 17:10
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/159994 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예cards1cards2goalresult ["i", "drink", "water"] ["want", "to"] ["i", "want", "to", "drink", "water"] "Yes" ["i", "water", "drink"] ["want", "to"] ["i", "want", "to", "drink", "water"] "No" 풀이function solution(cards1, cards2, goal) {..
-
[프로그래머스 Level 1] 추억 점수 (JavaScript)Coding Test/JavaScript 2024. 11. 25. 16:50
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/176963 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예nameyearningphotoresult ["may", "kein", "kain", "radi"] [5, 10, 1, 3] [["may", "kein", "kain", "radi"],["may", "kein", "brin", "deny"], ["kon", "kain", "may", "coni"]] [19, 15, 6] ["kali", "mari", "don"] [11, 1, 55] [["kali", "mari",..
-
[프로그래머스 Level 1] 명예의 전당 (1) (JavaScript)Coding Test/JavaScript 2024. 11. 25. 16:39
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/138477 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예kscoreresult3[10, 100, 20, 150, 1, 100, 200][10, 10, 10, 20, 20, 100, 100]4[0, 300, 40, 300, 20, 70, 150, 50, 500, 1000][0, 0, 0, 0, 20, 40, 70, 70, 150, 300] 풀이function solution(k, score) { const answer = []; const kNums = []; ..
-
[프로그래머스 Level 1] [1차] 비밀지도 (JavaScript)Coding Test/JavaScript 2024. 11. 25. 16:30
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/17681 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예매개변수값n5arr1[9, 20, 28, 18, 11]arr2[30, 1, 21, 17, 28]출력["#####", "# # #", "### #", "# ##", "#####"매개변수값n6arr1[46, 33, 33, 21, 31, 50]arr2[27, 56, 19, 14, 14, 10]출력["######", "### #", "## ##", " #### ", " #####", "### # " 풀이function solut..
-
[프로그래머스 Level 2] 멀리 뛰기 (JavaScript)Coding Test/JavaScript 2024. 11. 24. 19:50
문제 링크https://school.programmers.co.kr/learn/courses/30/lessons/12914 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 입출력 예nresult4533 풀이function solution(n) { if (n === 1) return 1; if (n === 2) return 2; let jump1 = 1; let jump2 = 2; let answer = jump2; for(let i=3; i 나는 문제를 풀 때 먼저 규칙을 찾아보는 편이다. 규칙을 찾아보려고 어느정도 계산을 해보았는데, 문제의 예시를 들어 설명해 보..