분류 전체보기24 자주쓰는 정규식 표현들 모음 자주쓰는 정규식표현(regexr) 및 형식(format) 모음 프로젝트를 진행하다 보면 로그인이나 회원가입 페이지 등을 개발할 때, 사용자가 입력한 값에 유효성 검사를 해야하는 경우가 많다. 여러 프로젝트를 반복적으로 진행하다 보니 자주 쓰는 정규식 표현들이 보여서 이번기회에 정리해 보았다. Check 비밀번호 정규식 이메일 정규식 아이디 정규식 한글 정규식 영어 정규식 숫자 정규식 주민번호 정규식 Format 핸드폰번호 형식 숫자에 쉼표(,) 넣기 주민등록번호 형식 사업자등록번호 형식 형식 체크 (Checking) 입력값이 형식에 맞는지 체크할 때 사용하는 정규식들의 모음이다. 더보기 정규식과 'test' 내장 함수를 이용하여, 입력값이 해당 정규식에 부합한지를 true or false로 return .. 2022. 1. 11. (Javascript) array 비교 방법 (Javascript) Array 비교 방법 자바스크립트에서 두 배열이 같은지 비교하는 방법을 알아보자. 급한 사람을 위해 결론부터 :) 가장 간단한 방법은 3가지로 배열을 아래처럼 String 형태로 만들어서 비교하는 방법이 가장 쉽다. String() 사용 toString() 사용 JSON.stringify 사용 (추천) const arr1 = [1,2,3]; const arr2 = [1,2,3]; // 결과는 셋다 true console.log( String(arr1) == String(arr2) ); console.log( arr1.toString() == arr2.toString() ); console.log( JSON.stringify(arr1) == JSON.stringify(arr2) );.. 2021. 12. 15. Canvas로 육각형 그래프 그리기 - js / vue canvas로 육각형 그래프 그리기 프로젝트를 진행하다보니 육각형 모양의 그래프를 만들어야 했습니다. 이미지를 사용한다면 좋겠지만, 데이터에 맞는 그래프를 그때그때 그려야 했기 때문에 HTML의 를 사용하여 구현하기로 하였습니다. 정육각형 그리는 법 먼저 정육각형을 그리는 방법부터 알아보겠습니다. 1. 먼저 정육각형의 꼭짓점이 될 6개의 점을 구해야합니다. 각 꼭짓점은 원을 6등분을 하면 구할 수 있습니다. 즉, 60도 간격으로 점을 찍으면 되겠네요. 2. 문제는 그림을 그리기 위해선 꼭짓점의 x좌표와 y 좌표를 구해야 한다는 것이죠. 반지름이 r이고 중심점이 (x,y)인 원을 6등분 했다고 가정해봅시다. 60도는 PI/3이니까 각 점의 x좌표는 x+r*cos(PI/3*i), y좌표는 y+r*sin(PI.. 2021. 12. 13. Count up 효과 (숫자 올라가는 효과) - js / vue Count up 효과 - js, vue로 구현하기 웹 개발을 하다보면 0부터 설정한 값까지 숫자가 올라가는 count-up 모션을 만들어야 하는 경우가 있습니다. 근데 카운트업 효과를 구글에 찾아보면 죄다 jQuery로 구현이 되어있더라구요. 그래서 직접 js와 vue를 이용해서 한번 만들어 보았습니다. 간단하게 만든거니 가져다 쓸 때 고치셔야 할거에요. JSFiddle 창을 클릭하면 결과와 소스를 볼 수 있습니다. JavaScript 로 구현 Vue 로 구현 이해가 안되시면 답글 달아주세요:) 2021. 12. 8. Atom 기본 세팅(기본 설정) Atom 기본 세팅(기본 설정) 개발을 할 때 개발 에디터는 필수입니다. 메모장을 써도 개발은 할 수는 있지만, 개발자를 도와주는 에디터를 쓰면 개발 효율이 비교할 수 없을 정도로 높아지기 때문이죠. (시간도 중요 자원이랍니다) 웹 개발 에디터에는 많은 종류가 있는데 오늘은 그 중 Github에서 개발한 ATOM의 기본 세팅을 해보겠습니다. Atom 설치 먼저 밑의 홈페이지에서 ATOM을 다운 받습니다. https://atom.io/ A hackable text editor for the 21st Century At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the .. 2021. 11. 27. 0. 웹 공부 로드맵 웹 공부 가이드 처음 웹 개발 공부를 시작할 땐 어떤걸 공부 해야할지도, 내가 뭘 모르는지도 몰라 막막합니다. 저 또한 아직 초보 개발자지만 정말 처음 웹 개발을 접했을 때 도움이 될 만한 가이드라인을 정리해 보았습니다 :) 프론트엔드 vs 백엔드 웹(Web)은 크게 프론트엔드와 백엔드, 2파트로 나뉩니다. 생소한 단어가 나와서 당황할 수 있는데요. 이 두 단어는 말 그대로 사용자와 가까운 '앞'쪽을 프론트엔드(Front + End), 사용자와 먼 '뒤'쪽을 백엔드(Back + End)라고 표현한 것입니다. 이름을 보면 살짝 감이 올텐데, 프론트엔드는 사용자에게 보여지는것을 담당하고, 백엔드는 서버쪽에서 사용자의 행동을 처리하는 기능을 담당한다고 생각하면 편합니다. 식당으로 비유를 하자면 홀서빙은 프론트.. 2021. 11. 24. 이전 1 2 3 4 다음