WEB Dev
-
[매일코딩-프로그래머스] 직사각형 별찍기 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 태그 없애는 정규식이 가장 깔끔하게 먹혔다. [자바스크립트] 정규표현식을 사용하여 태그만 제거하기 정규표현식을 사용한 태그의 제거 방법입니다. 태그를 제거하기 위해서 내장함수에서 태그를..
-
[매일코딩-프로그래머스] 문자열 다루기 기본 03WEB Dev/CordingTEST 2022. 1. 5. 11:00
쉬운문제여서 도전했는데 역시 쉬운 것은 없었고 조져지는 것은 나였다... [문제] 문자열 다루기 기본 문자열의 길이가 4이거나 6이고, 숫자로만 구성되어있는지 확인하는 함수를 구현하면 된다. 주어지는 문자는 1개부터 8개의 글자로 이루어져 있고, 숫자와 문자가 혼합될 수 있다. 길이가 4이거나 6이고, 숫자로만 되어 있는 조건을 만족하면 true를 출력하면 된다. [풀이] 어제까지 만든 코드를 돌려서 sArray를 출력해보았다. function solution(s) { var answer = true; var leng = s.length; if(leng >= 1 || leng
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 22WEB Dev/ToyProject 2022. 1. 5. 00:10
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 오늘 할 일은 책에 나온대로 Todo를 삭제하는 함수를 추가해본다. 투두메이트에서의 목표 삭제 버튼은 하단에 있고, 클릭하면 작성한 목표가 삭제된다. 요것은 나중의 자리배치의 문제일 것 같아서 우선 후딱 삭제 기능을 구현해본다. MUI의 ListItemSecondaryAction을 이용해서 삭제 버튼을 구현한다. 이 때 삭제 버튼 컴포넌트가 들어갈 곳은 이전에 만든 Goals.js 컴포넌트의 사이가 되겠다. 그리고 InputBase에 id와 name 속성이 있는지 확인한다. 이 id와 name이 삭제하거나 수..
-
[매일코딩-프로그래머스] 문자열 다루기 기본 01, 02WEB Dev/CordingTEST 2022. 1. 4. 10:39
어제 문자열다루기를 분명 풀어서 글을 올린 것 같은데..! 없어졌다! 저장도 안되어있는거 보니 날린듯 ㅠㅠ [문제] 문자열 다루기 기본 문자열의 길이가 4이거나 6이고, 숫자로만 구성되어있는지 확인하는 함수를 구현하면 된다. 주어지는 문자는 1개부터 8개의 글자로 이루어져 있고, 숫자와 문자가 혼합될 수 있다. 길이가 4이거나 6이고, 숫자로만 되어 있는 조건을 만족하면 true를 출력하면 된다. [풀이] 우선 문자열의 길이가 1~8 인지 확인하는 조건문을 준다. 그리고 문자열의 길이가 4개이거나 6개이면 각각의 문자열이 숫자인지만 확인하면 된다. 먼저 문자열의 길이가 1~8개인지 확인하는 조건문은 다음과 같다. 우선 s.length 그러니까 주어지는 문자열 s 의 길이를 변수에 담고 해당 변수를 확인한..
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 21WEB Dev/ToyProject 2022. 1. 4. 00:05
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 이제는 + 모양 버튼을 누르면 리스트가 추가되어야 한다. 이것도 김다정님의 책을 참고해서 일부분 변형해서 구현해보려고 한다. 지금 문제는 원래 todomate의 추가 버튼이 상단 바 오른쪽에 있어서 나도 그렇게 만들어야 한다면, route 별로 BasicNavBar가 다르게 보일 수 있도록 해야하는건지, 아니면 그냥 화면에 구현하고 위치만 상단으로 옮겨놔도 되는지 이다. 고민하다가 일단 버튼을 만들어서 상단에 올려놓고, 나중에 조건문을 쓰던 뭘 하던 해야겠다고 생각... 1. Todo를 추가하는 컴포넌트 만들..