bubbleSort 문제 정수를 요소로 갖는 배열을 입력받아 오름차순으로 정렬하여 리턴해야 합니다. 버블 정렬(bubble sort)은 여러 정렬 알고리즘(삽입 정렬, 퀵 정렬, 병합 정렬, 기수 정렬 등) 중 가장 기본적인 알고리즘입니다. 버블 정렬 알고리즘은 아래와 같습니다. 첫 번째 요소가 두 번째 요소보다 크면, 두 요소의 위치를 바꿉니다. (swap) 두 번째 요소와 세 번째 요소보다 크면, 두 요소의 위치를 바꿉니다. (swap) 1, 2를 마지막까지 반복합니다. (마지막에서 두 번째 요소와 마지막 요소를 비교) 1~3의 과정을 한 번 거치게 되면, 가장 큰 요소가 배열의 마지막으로 밀려납니다. 1~3의 과정을 첫 요소부터 다시 반복합니다. 5를 통해 두 번째로 큰 요소가 배열의 마지막 바로 ..

CSS란? 먼저 CSS가 무엇인지 알아보자면 CSS란 Cascading Style Sheets의 약자로, HTML이나 XML 같은 마크업 언어로 작성된 문서의 시각적인 스타일과 레이아웃을 정의하는 스타일 시트 언어입니다. CSS는 웹 페이지나 앱에 디자인을 적용해서 예쁘게 보이고 화면을 직관적으로 만들어주는 역할을 합니다. CSS의 발전 스토리 CSS는 1996년 W3C(World Wide Web Consortium)에서 처음 소개되었다고 합니다. 초기에는 HTML과 CSS를 함께 작성하고, 스타일 규칙을 적용할 HTML 요소를 선택하는 방법이 간단하게 설명되어 있었는데 이는 대규모 프로젝트에서 유지보수가 어렵고, 팀원 간 작업 효율성이 떨어진다는 문제점이 발생했대요! 90년대에는 화려한 인터페이스를 만..

오늘은 피그마 클론을 진행해보았다. 🔥 최소한 Lo-Fi 수준의 프로토타입을 구현해야 합니다. 페이지 이동이 가능해야 합니다. 스크롤 이벤트가 있어야 합니다. 최소한 1개의 마스터 컴포넌트와 인스턴스를 만들어야 합니다. 일단 기본 요구사항을 해결해보고자 했다. 기본이라도 잘 해보자.. 🥲 클론 사이트 선정 내가 선택한건 얼마전 알게되었던 서핏 홈페이지였다. 구글 확장프로그램으로 등록되어 크롬을 키면 첫화면에 나오는걸 보다가 반복적인 요소들이 많은것 같아서 작업하기 수월할 것 같다는 생각이었다.(큰 오산이였다..) 일단 홈페이지에 들어가서 구경을 하다가 개발자도구를 열어봤다.띠용? 뭔가 신기해.. (프론트엔드 개발자 채용하는 노션페이지로 연결되고 있었다 ㅎ) 홈페이지를 캡쳐하고 피그마에서 그리드를 12컬럼..

피그마란? 피그마는 프로핑타이핑 도구이면서 그래픽 편집을 동시에 할 수 있는 프로그램이에요! 피그마의 특,장점은 아래와 같이 많아요~ 1.실시간 협업기능 피그마는 하나의 draft(피그마에서는 '파일'과 같은 개념으로 사용됩니다!)를 함께하는 동료들과 공유하여 동시에 작업할 수 있으며, 다양한 플러그인을 사용할 수 있어서 웹, 앱 디자인 분야에서 사용하기 적절해요. 만약 edit가능한 권한을 받았다면 각 요소의 css코드도 추출할 수 있어요. 물론 간격이나 여백 수치 등 디자인 파일을 자세히 뜯어볼 수 도 있죠! 2.다양한 환경지원 피그마는 웹브라우저에서 동작되는 프로그램이기 때문에 Mac이나 Window 같은 PC의 OS 관계없이 어떤 환경에서도 디자인 작업이 가능해요! 심지어 리눅스나 크롬OS에서 작..

1. 다음 중 UI와 UX에 관한 설명으로 옳지 않은 것을 고르세요. A.키보드, 마우스 같은 물리적 요소도 UI에 포함 된다. B.UX는 UI를 포함하는 개념이다. C.UX는 제품 자체에 대한 사용자의 경험만을 말한다. D.나쁜 UI는 나쁜 UX를 유발한다. 더보기 A.키보드, 마우스 같은 물리적 요소도 UI에 포함 된다. B.UX는 UI를 포함하는 개념이다. 정답 C.UX는 제품 자체에 대한 사용자의 경험만을 말한다. UX는 제품 자체에 대한 사용자의 경험만을 말한다는 설명은 옳지 않습니다. UX는 제품 또는 서비스를 사용하는 사용자가 느끼는 전반적인 경험을 의미하며, 제품 자체 뿐만 아니라 사용자가 상호 작용하는 모든 측면을 고려합니다. UX는 사용자의 니즈와 요구에 맞추어 제품을 설계하고, 사용자..

fibonacci 문제 아래와 같이 정의된 피보나치 수열 중 n번째 항의 수를 리턴해야 합니다. 0번째 피보나치 수는 0이고, 1번째 피보나치 수는 1입니다. 그 다음 2번째 피보나치 수부터는 바로 직전의 두 피보나치 수의 합으로 정의합니다. 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, ... 입력 인자 1 : n number 타입의 n (n은 0 이상의 정수) 출력 number 타입을 리턴해야합니다. 주의사항 재귀함수를 이용해 구현해야 합니다. 반복문(for, while) 사용은 금지됩니다. 함수 fibonacci가 반드시 재귀함수일 필요는 없습니다. 입출력 예시 let output = fibonacci(0); console.log(output); // --> 0 output = ..

UI, UX (UI와 UX의 차이점) UI(User Interface, 사용자 인터페이스) UI는 사용자 인터페이스를 의미하며, 사용자와 시스템 간의 상호작용을 가능하게 하는 기술 또는 시스템의 외관, 레이아웃, 기능 등을 의미한다. UI는 사용자가 소프트웨어, 애플리케이션, 웹사이트, 기기 등과 상호작용할 때 경험하는 모든 것을 포함하며. 텍스트, 이미지, 아이콘, 버튼, 입력 필드, 애니메이션 등을 포함할 수 있다. 보통 UI라고 하면 떠오르는 화면상의 그래픽 요소 외에도, 키보드, 마우스 등의 물리적 요소도 컴퓨터와 상호 작용하기 위한 시스템이므로 UI라고 볼 수 있다. UI의 다양한 형태와 종류 그래픽 사용자 인터페이스(GUI): 그래픽으로 구성된 화면을 통해 사용자와 시스템 간의 상호작용이 이루..

문제1. 다음 중 재귀 함수의 정의로 맞는 것을 고르세요. A.함수를 호출하는 함수 B.자기 자신을 호출하는 함수 C.함수를 인자로 받는 함수 D.함수를 리턴하는 함수 더보기 A.함수를 호출하는 함수 B.자기 자신을 호출하는 함수 C.함수를 인자로 받는 함수 D.함수를 리턴하는 함수 문제2. 다음 중 재귀 함수를 구현할 때, 재귀의 탈출 조건과 관련있는 것을 고르세요. A. camel case B. recursive case C. pascal case D. base case 더보기 A. camel case B. recursive case C. pascal case D. base case 재귀 함수는 자기 자신을 호출하는 방식으로 동작하므로, 재귀를 반복하다 보면 언젠가는 멈춰야 합니다. 이때, 멈출 조건..