개발해보개

모바일 우선으로 스타일링 min-width 사용 (최소 가로사이즈 보다 큰 경우) 작은 가로폭부터 큰 가로폭 순서로 적용 /* 기본 (가로 360px보다 작은 화면에 적용되는 스타일) */ div { background-color: red; } /* 가로 360px보다 큰 화면에 적용되는 스타일 */ @media (min-width: 360px) { div { background-color: orange; } } /* 가로 600px보다 큰 화면에 적용되는 스타일 */ @media (min-width: 600px) { div { background-color: yellow; } } /* 가로 1000px보다 큰 화면에 적용되는 스타일 */ @media (min-width: 1000px) { div { b..

HTML CSS 2022. 11. 26. 21:58

숫자만 \d* ^[0-9]+$ 한글만 ^[가-힣]*$ 영문자만 (대소문자) ^[a-zA-Z]*$ 영문자만 (대소문자+띄어쓰기+공백) ^[a-zA-Z\s]*$ 숫자&영문 (대소문자) ^[a-zA-Z0-9]*$ 최소8자리에서 최대16자리까지 (숫자,영문,특수문자 각1개이상 포함) ^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,16}$ EMAIL ^[a-zA-Z0-9]+@[a-zA-Z0-9]+$ 휴대폰 ^01(?:0|1|[6-9]) - (?:\d{3}|\d{4}) - \d{4}$ TEL ^\d{2,3} - \d{3,4} - \d{4}$ 주민등록번호 \d{6} \- [1-4]\d{6} IP주소 ([0-9]{1,3}) \. ([0-9]{1,3}) \..

JavaScript 2022. 11. 26. 19:00

전화걸기 전화걸기 // 영상통화의경우tel-av:전화번호 를 사용하면 된다고 하니 참고. a태그를 사용하여 href 속성에 tel:전화번호 를 넣어주면, 해당 번호로 바로 전화를 걸 수 있도록 전화걸기 화면으로 이동 된다. 문자보내기 문자보내기 a태그를 사용하여 href 속성에 sms:전화번호 를 넣어주면, 해당 번호로 바로 문자를 보낼 수 있도록 화면으로 이동 된다.

HTML CSS 2022. 11. 26. 18:46

모바일에서 input keyboard 숫자 키보드로 띄우기 흔히 input type을 number로 지정해주면, 안드로이드에서는 문제없이 숫자 키패드를 띄워주지만, IOS에서는 숫자 키패드가 나오지 않는다. 이 경우 pattern 속성을 사용하여 숫자만 받을 수 있도록 지정할 수 있다. 또다른 방법으로는 inputmode 속성을 사용 하는 방법이다. // inputmode는 type 속성에 따라 정해지며 기본값은 text 이다. // input 작성시 모바일 가상 키보드가 나오지 않는다. // 소수점을 제공하는 숫자형 키보드가 나온다. // 숫자형 키보드가 나온다. // 전화번호를 입력하기 위한 숫자형 키보드가 나온다. // 검색을 위한 text 키보드가 나온다. // 이메일 입력을 위한 text(eng..

HTML CSS 2022. 11. 26. 18:30

웹소켓 (websocket) http의 경우 단방향 통신으로 요청 시 응답을 보내주는 형식이다. (요청이 있어야만 연결 되며 응답을 받은 후엔 연결이 종료됨). 이를 보완하기 위해 나온 것이 websocket이다. 웹소켓은 양방향 통신이 가능하다. http 가 stateless protocol 이라면 websocekt은 stateful protocol 이기 때문에 클라이언트와 한 번 연결이 되면 계속해서 통신을 주고 받을 수 있다. 때문에 실시간 통신이 가능하여 채팅이나 주식, 실시간 동영상 streaming, 온라인게임 등과 같은 실시간 정보가 필요한 서비스에 주로 사용된다. Websocekt은 초기에 연결한 오직 하나의 url만 존재한다. 웹소켓 커넥션을 만들려면 new WebSocket을 호출하는데..

Computer Science 2022. 9. 25. 20:07

웹의 3대 요소 웹을 구성하는 3대 요소로는 HTML , HTTP, URL이 있습니다. HTTP는 웹 서버와 웹 클라이언트 간에 통신을 할 수 있도록 지원해주며 URL은 웹 클라이언트가 웹 서버로 자원 요청 후 HTML이 담긴 응답을 맡으며 웹 클라이언트 프로그램인 웹 브라우저가 이를 해석하여 사용자에게 구조화된 인터페이스를 출력시켜 줍니다. 이렇듯 3대요소는 웹의 핵심적인 기술입니다.

Computer Science 2022. 2. 8. 20:39

블로그를 처음 개발할 때 json-server에 저장하는 방식으로 게시판을 구현하였는데, AWS로 배포를 하면서 MongoDB와 연동하는 걸로 바꾸게 되었다. 바꾸고 나서 사진을 올리려니 PayloadTooLargeError가 떴다.. 단순히 아 mongoDB는 용량이 작은가 보다. 하고 이미지 따는거 부터 다시 해야겠다 체념하고있었는데, 문득 그냥 구글링해보고싶었다. Wow 감사합니다. 초간단 해결법이 있었다. express이용하여 Node.js 웹 서버 구축시 express.json과 express.urlencoded를 입력하는데, 기본 값으로 100kb가 설정된다고 한다. limit 옵션으로 제한을 올려주니까 바로 해결! app.use(express.json({ limit : "50mb" })); ..

etc. 2022. 2. 8. 01:35

상수(Constant) 데이터를 저장 할 수 있는 메모리 공간을 의미하며, 변하지 않는 값. 변수 (Variable) 데이터를 저장 할 수 있는 메모리 공간을 의미하며, 그 값이 변경 될 수 있다. var , let 키워드를 사용하여 변수를 선언하며 쉼표로 여러 변수를 동시에 선언 및 초기화 할 수 있다. 선언되지 않은 변수를 사용하려고 하거나 접근하려고 하면, 오류가 발생하기 때문에, 선언되지 않은 변수를 초기화 할 경우에는 자동으로 선언을 먼저 한 후 초기화가 된다. 변수는 이름을 가지고 식별하므로, 변수의 이름은 식별자(indentifier)이기도 하며, 변수의 이름은 영문(대소문자구분),숫자(숫자로시작X),언더스코어(_),달러($)로만 구성된다. *전역변수 생성시 window.변수이름 과 같이 선..

JavaScript 2022. 2. 7. 20:17