전체 글

퍼블리싱/Vanilla JS

[Vanilla JS] 버튼을 클릭하면 늘어나는 아코디언 메뉴

💡 목표버튼을 클릭하면 아래로 길어지는 아코디언 메뉴 구현 📌 HTML Q. 사용 시간은? A. 60분 사용 가능합니다. Q. 사용 방법은? A. 부착하여 사용하시면 됩니다. Q. 몇 회 사용 가능? A. 1일 1회 사용 가능합니다.  📌 CSS- transition은 height: auto에는 먹히지 않는다. max-height를 활용하는 방법으로 수정 가능하다./* reset */* { margin: 0; padding: 0; }button { display: block; border: none; }/* 기본 세팅 */.accordionMenu { width: 100vw; height: au..

퍼블리싱/Vanilla JS

[Vanilla JS] 스와이퍼 없이 슬라이더 구현하기 (+ play/stop/progress bar)

💡 목표Swiper.js 없이 바닐라로 무한 슬라이더 구현하기.1. 5초동안 하나의 슬라이더를 보여주고, 프로그레스바로 남은 시간 출력2. 정지 버튼을 누르면 프로그레스바가 초기화되고, 자동 슬라이드가 멈춤3. 재생 버튼을 누르면 프로그레스바가 재시작죄고, 자동 슬라이드가 재개됨 📌 HTML 01 02  📌 CSS/* reset */* { margin: 0; padding: 0; }button { border: none; }/* 슬라이더 */.intro { position: relative; width: 100vw; height: 100vh; padding: 0; overflow: hidden; }.introSlider { d..

etc.

1월 회고 + 2월 시작!

📌 1월 회고. 시간이 왜 이렇게 빠르지 2024년 시작 글 쓴 지 일주일 된 것 같은데 벌써 2월이다 작년 12월까지 회사 업무가 널널해서 쉬엄쉬엄 했는데 이번년도 되자마자 엄청난 업무량... 그리고 생각보다 쉽지 않은 방통대 직장병행... 그래도 신년 버프로 퇴근하고 공부도 좀 하고, 이모티콘도 그리고, 블로그도 쓰고, 유튜브 업로드도 꽤 했다. 나 꽤나 부업에 진심일지도 이모티콘은 무려 다섯개나 제출했다 게다가 하나는 승인 😎 이번년도는 꾸준히 제출해서 부자가 될 것... (큰 꿈) 1월, 영상도 꽤 열심히 올렸더니 유튜브 구독자도 많이 늘었다 회사 일보다 부업이 더 즐거운데 정상인가 취미지만 열심히 해볼 예정 1월 한 달 동안 꽤 열심히 살았으나 리액트 강의를 완강하지 못했다. 바빴지만 나태했던 ..

Git

[Git] Git 기초 / 맥OS 깃 설치

갓생 1일차. 무지성 add + commit만 알고 있던 나. 미루고 미루던 git을 공부할 것이다. 학교다니면서 프로젝트 할 때 몇 번 사용하고, 회사에서는 회사 공유폴더에 백업해두는 편이라 깃을 잘 사용하지 않았다. 코테 문제 백준허브로 업로드 하는 정도....? (그것도 백준허브가 다 해줌) 주변에서 많이들 추천해준 코딩애플님의 강의로 선택했다. 📌 git 설치하기 맥OS는 처음이니까 차근차근 따라 해보자. 1. 홈브류 설치 - 홈브류(Homebrew)란? 맥OS용 패키지 관리 애플리케이션 1) 터미널 열기 2) https://brew.sh/ 접속해서 길게 적혀있는 설치 명령어를 터미널에 입력 3) 비밀번호 입력하라고 하셨는데 안해도 잘 넘어가더라. 엔터 엔터 하니 설치 완료 4) 홈브류 설치 다 ..

etc.

2024년 시작!

어느새 2024년이 시작됐다. 매년 하는 새해 결심이지만 이번년도는 진짜(?)다. 운동도 하고, 공부도 하고, 책도 읽어야지... 회사 업무가 갑자기 많아지고, 그만큼 스트레스도 늘어난 12월... 이로 인해 블로그와 코테에도 약간 소홀해졌다. 아주 약간... 이제 새해를 맞이했으니 새마음 새뜻으로 다시 개발자의 길을 닦아보려 한다. 뽀득뽀득 이제 매 월 목표를 세우고, 월 말에 주절주절 회고록을 쓸 것이다. 다이어리 사놓고 한 번도 꽉 채워본 적 없는데, 이번엔 쓴다. 진짜진짜로. ⭐️ 2024년 목표 ⭐️ 10kg 감량 (주 4회 이상 운동하기) 토이 프로젝트 3개 이상 모던 자바스크립트 Deep Dive 완독 개발자 취업.... 제발요 ⭐️ 1월 목표 ⭐️ 노마드코더 리액트 강의 완강 프로그래머스 ..

프로그래머스/Lv. 1

[프로그래머스] Lv.1 카드 뭉치 / JS

📕 문제 설명 코니는 영어 단어가 적힌 카드 뭉치 두 개를 선물로 받았습니다. 코니는 다음과 같은 규칙으로 카드에 적힌 단어들을 사용해 원하는 순서의 단어 배열을 만들 수 있는지 알고 싶습니다. 원하는 카드 뭉치에서 카드를 순서대로 한 장씩 사용합니다. 한 번 사용한 카드는 다시 사용할 수 없습니다. 카드를 사용하지 않고 다음 카드로 넘어갈 수 없습니다. 기존에 주어진 카드 뭉치의 단어 순서는 바꿀 수 없습니다. 예를 들어 첫 번째 카드 뭉치에 순서대로 ["i", "drink", "water"], 두 번째 카드 뭉치에 순서대로 ["want", "to"]가 적혀있을 때 ["i", "want", "to", "drink", "water"] 순서의 단어 배열을 만들려고 한다면 첫 번째 카드 뭉치에서 "i"를 사..

안댕이
'분류 전체보기' 카테고리의 글 목록 (2 Page)