TIL

[TIL] 한번만 쓰고 버린다구요?

🔨투 두 리스트 제작하기 🖼Find CSS reference 버튼이나 인풋같은 컴포넌트를 styled-components를 이용해서 재사용가능하도록 공을 많이 들여서 설계했다. 그러기 위해서 일단 레퍼런스를 참고해서 최대한 깔끔하게 만들려고 했다. Input field explanation ... codepen.io Input Focus & Placeholder Effects with CSS3 Input Focus & Placeholder Effects with CSS3 Ported from http://goo.gl/vnCbPQ... codepen.io Top bar that hides and shows with scroll like android A web implementation of a top b..

[TIL] 졌잘싸

🤼‍♀️언어스터디 객체 챕터 객체란? 객체(object)란 실생활에서 우리가 인식할 수 있는 사물로 이해할 수 있다. 자바스크립트에서는 이름과 값으로 구성된 속성을 가지는 기본 데이터 타입을 말한다. 자바스크립트에서의 객체는? typeof([]) > "object" typeof({}) > "object" // 함수는 객체의 특성을 가지고 있지만 typeof로는 function을 출력함. typeof(function(){}) 'function' 자바스크립트에서는 원시 값을 제외한 나머지 값(함수, 배열 정규표현식)은 모두 객체이다. 자바스크립트를 구성하는 거의 모든 것이 객체라고 생각하면 된다. 자바스크립트는 객체 기반의 프로그래밍 언어라고 할 수 있다. 객체 구조 살펴보기 var counter = { n..

[TIL] 성불하게 해주세요

투 두 리스트 프로젝트 레퍼런스 정리 to do list designs https://www.figma.com/file/cJQVBTDf5mKwXQaIxzP3Uy/To-Do-List-App-UI-(Community)?node-id=5%3A17&t=Q9m6JbOv3t49ryHZ-0 Figma Created with Figma www.figma.com ToDo List Inspiration ToDo List Inspiration via Muzli medium.muz.li vitest vite 전용 테스팅 툴 vitest 영어 글, 번역 글 Common mistakes with React Testing Library Common mistakes with React Testing Library Some mista..

[TIL] 비트 주세요

🖼HTML 태그 익히기 이 간단한 html 태그 작성하는데 깔끔하게 만들어보려다보니 생각보다 오래 걸렸다. 선택과 집중으로 css는 적용하지 않고 요구사항만 완성하고 바로 nelify에 배포해서 제출했다. html은 이 사이트에서 공부했는데 html, css 관련 문서가 정리가 너무 잘되어 있어서 html 태그에 대해서 다시 제대로 공부해보는 계기가 됐다. UXKM html, css, javascript, accessibility, ncs 등의 강의를 목적으로 제작 uxkm.io netlify가 사용자가 세팅할 일도 별것 없이 폴더를 드래그 앤 드랍만 하면 자동으로 배포가 되어서 정말 편한 서비스라는 생각이 들었다. 사용량이 높지 않을 때 서비스 검증단계에서 써볼 만 하겠다 🪂리액트 시작하기 그냥 cra..

[TIL] 인생은 시험의 연속이다.

🧾알고리즘 테스트 1. 윷놀이 우리나라 고유의 윷놀이는 네 개의 윷짝을 던져서 배(0)와 등(1)이 나오는 숫자를 세어 도, 개, 걸, 윷, 모를 결정합니다. 네 개 윷짝을 던져서 나온 각 윷짝의 배 혹은 등 정보가 주어질 때 도(배 1개, 등 3개), 개(배 2개, 등 2개), 걸(배 3개, 등 1개), 윷(배 4개), 모(등 4개) 중 어떤 것인지를 결정하는 프로그램을 작성하세요. chechin result [0, 1, 0, 1] 개 [1, 1, 1, 0] 도 [0, 0, 1, 1] 개 [0, 1, 0, 0] 걸 function solution(arr1) { let answer= ""; let bae = 0; for(i in arr1){ if(arr1[i] === 0){ bae++; } } switc..

[TIL] 고통이 무뎌질 만큼

🧾알고리즘을 풀어보자 프로그래머스 / level2 / 기사단원의 무기 GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. Contribute to synuns/algorithm-study development by creating an account on GitHub. github.com 약수의 개수를 구해야하는 문제인데 n의 약수를 구한다고 할 때 1부터 n까지 반복문을 돌려버리면 바로 시간초과가 나버리는 문제이다. 약수의 개수를 구하는 알고리즘을 찾아봤는데 생각보다 많이 알고리즘이 존재해서 놀랐다. 나는 약수를 나눈 값도 약수라는 원리를 이용해서 풀이했다. 예를 들어서 10을 기준으로..

[TIL] 자바스크립트를 알고리즘으로 배웠어요

👨‍⚖️자바스크립트 함수에 대해 공부해보자! 함수의 기본 형태 함수 선언, 함수 호출, 매개변수(parameter), 리턴값 익명함수 function () {} : 이름이 붙어있지 않은 함수를 익명함수라고 부른다 함수 선언의 장점 반복 작업을 피할 수 있다. 모듈화로 가독성이 높아진다 기능별 수정으로 유지보수가 좋다. 함수로 모듈화를 깔끔하게 해놓은 코드만큼 보기 좋은게 없지 암 선언적 함수 function 함수() { // 함수 선언식 } let 함수 = function () {}; // 함수 표현식 let 함수 = () => {}; // 화살표 함수 함수 선언식과 표현식의 호이스팅 차이를 꼭 알고 써야함! 화살표 함수와 일반함수의 차이점 JavaScript - 화살표 함수와 일반 함수의 차이 Java..

[TIL] 행복했던 너와 이제는 안녕...

[2022.11.19 TIL] 프론트엔드 공부를 시작하고나서 받아온 데이터들을 자바스크립트로 처리하는데 한계를 느끼고 코딩테스트 용도뿐만 아니라 자바스크립트로 알고리즘 풀이하는 것에 필요성을 많이 느꼈다. 벌써 작성한지 오래된 코드인데도 그 때 기억이 너무 깊게 남아서 잊을 수가 없다. Lodash쓰고 어찌저찌해서 엄청 더럽게 코드를 짰었다. 알고리즘 공부 해야지 해야지 하다가 이번 항해를 계기로 본격적으로 자바스크립트로 문제풀이를 시작했다. 한동안 꽤 오랫동안 파이썬을 사용해와서 그런지 쉬운 문제에도 세부적인 문법이나 처리를 헷갈려서 어렵게 어렵게 문제를 풀었다. 자바스크립트를 사용하면서 느낀 많고 많은 것들중에 하나는 함부로 결과를 판단해버리지 말고 조건문이나 연산을 정확히 작성해야한다는 점 한가지 ..