본문 바로가기

전체 글

(87)
프로그래머스 JavaScript 클릭하면 해당 레벨 목록으로 이동합니다. Level 1 Level 2 Level 3 Level 4 Level 5 Level 1 2016년 3진법 뒤집기 K번째수 x만큼 간격이 있는 n개의 숫자 가운데 글자 가져오기 같은 숫자는 싫어 나누어 떨어지는 숫자 배열 내적 두 개 뽑아서 더하기 두 정수 사이의 합 로또의 최고 순위와 최저 순위 모의고사 문자열 내 p와 y의 개수 문자열 내 마음대로 정렬하기 문자열 내림차순으로 배치하기 문자열 다루기 기본 문자열을 정수로 바꾸기 서울에서 김서방 찾기 소수 만들기 소수 찾기 수박수박수박수박수박수? 시저 암호 신규 아이디 추천 실패율 약수의 합 예산 완주하지 못한 선수 음양 더하기 이상한 문자 만들기 자릿수 더하기 자연수 뒤집어 배열로 만들기 정수 내림차순으로 배치하기..
[Adobe Photoshop] 한글 폰트 엑박모양으로 깨짐 현상 해결 방법 최근 잘 사용해오던 폰트가 photoshop파일에서 엑박모양으로 나오기에, 처음에는 컴퓨터의 일시적 오류인가 싶었지만 계속 이런 현상이 지속되었다. 검색해본 결과 최신 버전인 22.3에서 이러한 오류가 난다는 것을 보고 버전을 22.2로 낮춰서 사용해본 결과 오류가 해결되었다! 버전은 어도비 클라우드에서 간단하게 변경할 수 있다. 앱에서 포토샵을 찾아서 ••• 을 클릭해서 기타 버전을 클릭한다. 22.3이하 버전을 선택해서 설치를 클릭한다. 그러면 아래와 같은 메세지가 뜨게되는데 계속을 선택해 진행한다. 이런게 완료하고나면 폰트가 깨지던 문제가 해결된다. 위에서 자동 업데이트가 비활성화 된다는 메세지가 나왔었는데 나중에 필요하다면 환경설정 > 앱 에서 자동업데이트를 다시 켜면 된다.
[프로그래머스 JavaScript] 3진법 뒤집기 - 10진법을 3진법으로 바꿔줍니다. - 나온 숫자를 뒤집어줍니다. - 이 숫자를 다시 10진법으로 표현합니다. function solution(n) { var answer = 0; // 10진법으로 나타냈던 숫자를 3진법으로 바꿔줍니다. const transNum = n.toString(3); // 3진법으로 나타낸 숫자를 뒤집어줍니다. const reverseNum = transNum.split('').reverse().join(''); // 현재 3진법으로되어있는 것을 다시 10진법으로 되돌려줍니다. answer = parseInt(reverseNum, 3); return answer; } toString() : 특정한 Number 객체를 나타내는 문자열을 반환하는 메서드 * toString(진수)..
Vue.js & React YouTube에서 Vue.js/React/입문자도 이해하기 쉬운 명쾌한 비교 를 보고 정리한 글입니다. 링크 : www.youtube.com/watch?v=W8uxLdeev7s React는 함수, JavaScript에 더 가깝다. html, css도 JavaScript로 다 해버리자이다. Vue는 html, css, js의 특성을 각각 살려서 편하게 만들자이다. 공식페이지에서 소개를 보면 React는 라이브러리라고하고, Vue는 프레임워크라고 소개했다. 라이브러리가 기능들이 좀더 간단하지만, 더 복잡한 구현을하려면 자기가 직접해야한다. 프레임워크는 다 갖춰져 있다. 그래서 초보가 프로젝트를 하기에는 html, css, js의 역활이 명확하고, 더 많이 갖춰져 있는 Vue가 좋다고 생각한다. 프로그래밍 외..
[Visual Studio Code] live server - 모바일에서 확인하기 Visual Studio Code에서 Live Server라는 프로그램을 사용하면 코딩하는 것을 실시간으로 브라우저로 확인할 수 있습니다. 여기에서는 Live Server를 모바일에서도 확인하는 방법을 알아보려고 합니다. Live Server의 Feature Contributions를 읽어보면 liveServer.settings.host 라는 것이 있습니다. To switch between localhost or 127.0.0.1 or anything else. Default is 127.0.0.1라는 설명과 함께 초기에 설정이 127.0.0.1 로 되어있는데 이것을 내 아이피 로 변경해주면 모바일에서도 확인할 수 있게 됩니다. 1. Live Server를 우클릭해서 Extension Settings에 ..
[JavaScript30] Day 30 Whack A Mole const holes = document.querySelectorAll('.hole'); const scoreBoard = document.querySelector('.score'); const moles = document.querySelectorAll('.mole'); function randomTime(min, max) { return Math.round(Math.random() * (max- min) + min); } Math.random()으로 숫자를 가져오면 숫자가 정수로 나오지 않는다. 그래서 Math.round()으로 정수로 만들어 준다. function randomHole(holes) { console.log(holes.length); } function rando..
[JavaScript30] Day 29 Countdown Timer function timer(seconds) { setInterval(function() { seconds--; }, 1000); } 이렇게 매 초마다 1초씩 줄어들게 하는 것은 가끔 작동하지 않는 오류가 있다. 예를 들어 해당 탭을 오랫동안 켜지않을 경우에는 타이머가 멈추게 된다. function timer(seconds) { const now = Date.now(); // Date.now() = (new Date()).getTime(); const then = now + seconds * 1000; console.log({now, then}); } then에서 1000을 곱해준것은 초를 밀리초로 바꾸기 위해서 이다. ( 1s = 1000ms ) function timer(s..
[JavaScript30] Day 28 Video Speed Controller const speed = document.querySelector('.speed'); const bar = speed.querySelector('.speed-bar'); const video = document.querySelector('.flex'); speed.addEventListener('mousemove', function(e) { console.log(e); }); bar에 마우스가 enter되면 좌표를 출력해 줍니다. const speed = document.querySelector('.speed'); const bar = speed.querySelector('.speed-bar'); const video = document.querySelector(..
[JavaScript30] Day 27 Click and Drag const slider = document.querySelector('.items'); let isDown = false; let startX; let scrollLeft; slider.addEventListener('mousedown', () => { isDown = true; }); slider.addEventListener('mouseleave', () => { isDown = false; }); slider.addEventListener('mouseup', () => { isDown = false; }); slider.addEventListener('mousemove', () => { console.log(isDown); console.log('Do Work!!') })..
[JavaScript30] Day 26 Stripe Follow Along Nav const triggers = document.querySelectorAll('.cool > li'); const background = document.querySelector('.dropdownBackground'); const nav = document.querySelector('.top'); function handleEnter() { console.log('ENTER!!'); } function handleLeave() { console.log('LEAVE!!'); } triggers.forEach(trigger => trigger.addEventListener('mouseenter', handleEnter)); triggers.forEach(trigg..
[JavaScript30] Day 25 Event Capture, Propagation, Bubbling and Once const divs = document.querySelectorAll('div'); function logText(e) { console.log(this.classList.value); } divs.forEach(div => div.addEventListener('click', logText)); 제일 가운데의 coral컬러 박스를 클릭하면 one. two. three가 모두 클릭되게 된다. // console.log(this.classList.value) console.log(this) 이렇게 this로 확인하면 태그 전체로 확인할 수 있다. const divs = document.querySelectorAll('div'..
[JavaScript30] Day 24 Sticky Nav const nav = document.querySelector('#main'); const topOfNav = nav.offsetTop; function fixNav() { console.log(topOfNav); } window.addEventListener('scroll', fixNav); 스크롤을 해보면 계속 같은 숫자만 찍히는데 이 숫자가 nav의 현재 위치값이다 스크롤을해서 지나간 만큼은 window.scrollY로 알수있다. const nav = document.querySelector('#main'); const topOfNav = nav.offsetTop; function fixNav() { if (window.scrollY >= topOfNav) { document.b..
[JavaScript30] Day 22 Follow Along Link Highlighter const triggers = document.querySelectorAll('a'); const highlight = document.createElement('span'); highlight.classList.add('highlight'); document.body.append(highlight); function highlightLink() { console.log('Highlight!!'); } triggers.forEach(a => a.addEventListener('mouseenter', highlightLink)); link 부분에 마우스가 올라가면 console창에 Highlight 메세지가 뜬다. const triggers = docu..
[JavaScript30] Day 18 Adding Up Times with Reduce const timeNodes = document.querySelectorAll('[data-time]'); console.log(timeNodes); const timeNodes = document.querySelectorAll('[data-time]'); const seconds = timeNodes.map(node => node.dataset.time); const timeNodes = Array.from(document.querySelectorAll('[data-time]')); const seconds = timeNodes.map(node => node.dataset.time); 0은 분이고 1은 초이다 const timeNodes = Array...
[프로그래머스 JavaScript] Level1 제일 작은 수 제거하기 function solution(arr) { var answer = []; var smallest = 0; for(var i = 0; i x == smallest), 1); answer = arr.length == 0 ? [-1] : arr; return answer; }
[프로그래머스 JavaScript] Level1 정수 제곱근 판별 function solution(n) { var answer = 0; answer = Math.sqrt(n) == Math.round(Math.sqrt(n)) ? Math.pow(Math.sqrt(n)+1, 2) : -1; return answer; }
[프로그래머스 JavaScript] Level1 정수 내림차순으로 배치하기 function solution(n) { var answer = 0; n = n.toString().split('').sort((a, b) => b - a).join(''); answer = Number(n); return answer; }
[프로그래머스 Javascript] Level1 자연수 뒤집어 배열로 만들기 function solution(n) { var answer = []; answer = n.toString().split('').reverse().map(val => Number(val)); return answer; }
[프로그래머스 JavaScript] Level1 모의고사 function solution(answers) { var answer = []; var total1 = 0; var total2 = 0; var total3 = 0; for(var i = 0; i < answers.length; i++) { var index = i % 5 if(index == 0) { answers[i] == 1 ? total1++ : total1; } else if(index == 1) { answers[i] == 2 ? total1++ : total1; } else if(index == 2) { answers[i] == 3 ? total1++ : total1; } else if(index == 3) { answers[i] == 4 ? total1++ : total1; } else ..
[프로그래머스 JavaScript] Level1 완주하지 못한 선수 function solution(participant, completion) { var answer = ''; participant.sort(); completion.sort(); for(var i = 0; i < participant.length; i++) { if(participant[i] != completion[i]) { answer = participant[i] participant.splice(i, 1) } } return answer; }