WEB Dev
-
[매일코딩-프로그래머스] 행렬의 덧셈 01WEB Dev/CordingTEST 2022. 1. 14. 10:48
이번주의 마지막 문제! [문제] 행렬의 덧셈 행과 열의 크기가 같은 두 행이 각각 arr1 , arr2 에 주어지고 같은 행, 열에 있는 값을 더해주어 반환한다. [풀이] 행렬은 배열인데, 배열 안에 배열이 있는 이중 배열로 들어있게 된다. 각 값의 인덱스(위치)가 모두 같으므로 같은 인덱스 값을 더하는 반복문으로 만들어야겠다. 그리고 조건이 있으므로 조건문을 우선 만들어준다. 행과 열의 길이가 500을 넘지 않는다. 제한조건에 따른 조건문 만들기 function solution(arr1, arr2) { var answer = [[]]; if(arr1.length
-
[매일코딩-프로그래머스] x만큼 간격이 있는 n개의 숫자WEB Dev/CordingTEST 2022. 1. 13. 10:45
오늘은 직사각형 별찍기 옆에 있는 문제를 풀어보자 (～￣▽￣)～ [문제] x만큼 간격이 있는 n개의 숫자 우선 숫자를 두 개 준다. 각각 x와 n으로 넘겨주고, x부터 시작해 x씩 증가하는 숫자를 n개 가지는 배열을 리턴하는 함수를 가지게 된다. 조건은 x는 -10000000 이상 10000000 이하의 정수고, n은 1000 이하의 자연수이다. [풀이] 처음에는 제한조건을 완전히 무시하고 풀었었는데, 이것도 문제의 일부분이라 조건을 잘 맞춰야 하더라. 자바스크립트는 자연수와 정수를 크게 구분하지 않는 것으로 알고 있는데 (아닐수도 있습니다!!!) 메소드를 찾아보니 정수인지 아닌지 판별하는 메소드가 있었다. Number.isInteger() Number.isInteger() - JavaScript | M..
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 26WEB Dev/ToyProject 2022. 1. 13. 00:36
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 ListItemText로 구현된 목표 텍스트를 클릭하면 위의 GoalForm의 TextField로 다시 title state가 전달되도록 해보자 그러려면 ListItemText 태그에 onClick으로 이벤트핸들러 함수를 바인딩 시켜야 한다. editEventHandler 라는 함수를 목표 삭제 이벤트핸들러인 deleteEventHandler 근처에 만들어준다. 클릭하면 콘솔에 값이 정상적으로 입력되는지 확인하기 위해 console.log('id : ', e.target.id)과 console.log('tit..
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 25WEB Dev/ToyProject 2022. 1. 13. 00:25
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 어제 만들어둔 수정 함수를 이어서 개발하려고 하는데 복잡한 기능을 구현하려고 하니 많이 막막해졌다. 하나씩 정리해서 풀어나가보자 목표 수정 기능을 위해 구현해야 할 것 - 현재 표시된 목표를 클릭하면 해당 state의 title과 key가 GoalForm에 전달될 것 - GoalForm의 textfield에 state의 title이 적힐 것 - title을 수정하고 다시 등록버튼을 누르면 같은 key의 state가 업데이트 될 것 그리고 기존에 작성한 목표 컴포넌트를 보면 InputBase로 적혀있는데 이게 ..
-
[매일코딩-프로그래머스] 직사각형 별찍기 02WEB Dev/CordingTEST 2022. 1. 12. 11:02
어제 풀던 문제를 마저 풀어본다. [문제] 직사각형 별찍기 n과 m이라는 정수가 두 개 주어진다. 그리고 * (애스터리스크, 별) 문자를 이용해 n x m 인 직사각형 형태를 출력해주면 된다. [풀이] 가만 보니 내가 반복문으로 출력하는 것은 그냥 한 줄로 쭉 나열되고 있었다. (계속 줄바꿈이 일어남) 그래서 '별찍기' 키워드로 찾아보니 .repeat라는 메소드를 사용하고 있었다. String.prototype.repeat() - JavaScript | MDN repeat() 메서드는 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환합니다. developer.mozilla.org 이런 메소드도 있었구만... 메소드는 외워도 외워도 까먹고 외워도 외워도 새로운게 나오는 것 같다. 역시 문제가 닥치..
-
[매일코딩-프로그래머스] 직사각형 별찍기 01WEB Dev/CordingTEST 2022. 1. 11. 10:34
어제는 한번에 문제를 풀어서 기분이 엄청 좋았다. 오늘은 쉬움 난이도 맨 처음에 있는 직사각형 별찍기라는 문제를 풀어본다. [문제] 직사각형 별찍기 n과 m이라는 정수가 두 개 주어진다. 그리고 * (애스터리스크, 별) 문자를 이용해 n x m 인 직사각형 형태를 출력해주면 된다. 트리찍기와 비슷한걸까? 그러고보니 트리도 안찍어봤네... [풀이] 처음부터 특이하다. 뭔가 ... 그냥 출력 함수인가본데 모양이 독특하네. process.stdin.setEncoding('utf8'); process.stdin.on('data', data => { const n = data.split(" "); const a = Number(n[0]), b = Number(n[1]); console.log(a); console..
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 24WEB Dev/ToyProject 2022. 1. 11. 00:24
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 저번주에 만들었던 수정 부분이 뭔가 잘못되었다고 생각한다. 우선 readOnly 상태를 변경하는 것은 잘 되었으나, 우리가 생각했던 방식의 수정은 아닌 것 같다. readOnly 상태를 두되, 우리는 목표를 클릭하면, 다시 Input에 목표가 노출되고 그것을 다시 수정해서 확인 버튼을 통해 등록될 수 있도록 해야한다. 그래서 목표를 클릭하면 readOnly가 false가 되고 Input에 값이 노출되도록 해보자. 우선 offReadOnlyMode 함수를 수정해서 아래와 같이 만들어 준다. // 목표를 클릭하면..
-
[매일코딩-프로그래머스] 핸드폰 번호 가리기 01WEB Dev/CordingTEST 2022. 1. 10. 10:55
아침에 할 일이 많은데 잠깐이라도 머리를 풀고 가야 할 것 같아서 프로그래머스를 켰다. 힘들고... 서럽구만... [문제] 핸드폰 번호 가리기 주어지는 변수는 phone_number 라는 변수고 전화번호이다. 전화번호 뒤의 4자리를 제외한 앞자리를 전부 * 애스터리스크로 가리고 리턴하는 함수를 작성하라. 근데 왜 제한 조건에는 s라고 되어 있는건지 모르겠지만 아무튼 주어지는 변수는 길이가 4자 이상, 20자 이하인 문자열이다. [풀이] 제한 조건을 먼저 조건문으로 작성한다. function solution(phone_number) { var answer = ''; if( 4
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 23WEB Dev/ToyProject 2022. 1. 6. 23:47
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 오늘은 수정부분을 만들 차례! 실제로 책에서 도움을 받을 수 있는 부분은 서버 연결이라고 생각한다. 책에서는 엄청 단순한 앱을 만들기 때문이다 ㅠㅠ 어쨌든 투두 등록, 수정, 삭제가 기능의 대부분이니까 ... 수정에는 두 가지가 있다. 첫번째는 투두 상태 변화다. 투두에 체크를 하면 할 일을 완료한 상태이기 때문에 items state의 done 값이 true가 되게 하는 것과 이미 등록한 투두를 수정하는 것이다. 그리고 또 한 가지는 이미 등록한 투두를 클릭하면 내용을 바꿀 수 있게 하는 단계다. 이 단계가..
-
[Javascript] 정규식으로 태그 제거하기WEB Dev/Javascript | REACT | Node.js 2022. 1. 6. 16:11
모든 꺽쇠로된 HTML 태그 제거하기 var txt = ~텍스트~; txt.replace(/(]+)>)/ig,"") 태그 중 일부분만 제거하기 var txt = ~텍스트~; txt.replace(/]*)>/gi,""); navigator.share 이용해 공유 기능을 구현하는데 data 태그로 text를 받아오다보니 개행 태그가 그대로 노출되어 정규식과 replace 메소드를 이용해 제거하였다. 인터넷의 대부분의 정규식을 적용해보았으나 가장 정확하게 드는 정규식이라 기록한다! 출처는 아래에! 을 제거하는데도 모든 HTML 태그 없애는 정규식이 가장 깔끔하게 먹혔다. [자바스크립트] 정규표현식을 사용하여 태그만 제거하기 정규표현식을 사용한 태그의 제거 방법입니다. 태그를 제거하기 위해서 내장함수에서 태그를..