[JavaScript] email 형식 검사하기[JavaScript] email 형식 검사하기

Posted at 2018. 9. 27. 18:30 | Posted in JavaScript & jQuery/JavaScript
반응형




■ email 형식 검사하기




# 소스코드

<html>
<head>
<title>:: JAVASCRIPT e-Mail 형식 검사 ::</title>
<script type="text/javascript">
    function inputeIsEmail(mail) {
       
        // 변수를 선언한다.
        var regExp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;

        // 이메일 확인
        // test( ) : 검색한 문자열에 패턴이 있는지 여부를 나타낸다, 문자열이 존재하면 true, 존재하지 않으면 false를 리턴한다.
        if(regExp.test(mail.value) == false) {
            alert("e-mail 형식이 일치하지 않습니다.\n다시 입력하여 주시기 바랍니다.");
            mail.value = "";
            mail.focus();
        } else {
            alert("e-mail 형식에 맞게 입력하였습니다.");
        }
    }
</script>
</head>
<body>
    <input type="email" id="mail" value=""/>
    <input type="button" onClick="inputeIsEmail(mail);" value="검사"/>
</body>
</html>




# 출력결과




반응형
저작자표시

'JavaScript & jQuery > JavaScript' 카테고리의 다른 글

[JavaScript] Password 형식 검사하기  (1) 2018.10.24
[JavaScript] 읽기 쉽고, 유지보수하기 쉬운 코드 작성하기 - 코딩규약  (0) 2018.10.12
[JavaScript] Audio 객체를 이용한 음악 재생  (0) 2018.09.27
[JavaScript] 현재 위치를 지도에 찍어주는 Geolocation  (0) 2018.09.13
[JavaScript] 저장소 사용하기  (0) 2018.09.07
//

[JavaScript] Audio 객체를 이용한 음악 재생[JavaScript] Audio 객체를 이용한 음악 재생

Posted at 2018. 9. 27. 15:47 | Posted in JavaScript & jQuery/JavaScript
반응형




■ 웹 브라우저에서 MP3 음악 틀기




-. HTML5부터는 플래시와 같은 플러그인을 사용하지 않아도 Audio 태그를 사용할 수 있게 되었다.

-. 자바스크립트의 Audio 객체를 이용해서 음악을 플레이해 보자.



# Audio 객체의 속성

속성 이름

설  명

src

 · 재생하려는 음악 파일 경로

volume

 · 음악의 음량

 · 음량조절은 0부터 1까지 소수점 단위로 조절할 수 있다.(예 : 0.5)

currentTime

 · 음악의 현재 위치(초 단위)




# Audio 객체의 메서드

메서드 이름

설  명

play( )

 · 음악을 재생

pause( )

 · 음악을 일시정지




# 정지(STOP) 기능

-. Audio 객체는 정지(STOP) 메서드가 없다.

-. 음악을 정지하고 처음위치로 이동하고 싶을때는 pause( ) 메서드를 사용하고 currentTime 속성을 0으로 바꿔주어야 한다.




# 소스코드

<html>
<head>
<title>:: JAVASCRIPT 음악 재생 ::</title>
<script type="text/javascript">

    // Audio 객체생성 ①
    // var audio = new Audio('./lucky.mp3');

    // Audio 객체생성 ②
    var audio = new Audio();
    audio.src = "./lucky.mp3";


</script>
</head>
<body>
    <input type="button" onClick="audio.play();" value="PLAY"/>
    <input type="button" onClick="audio.pause();" value="PAUSE"/>
    <input type="number" onChange="audio.currentTime=this.value"/>
    <input type="number" onChange="audio.volume=this.value"/>
</body>
</html>




# 출력결과








반응형
저작자표시

'JavaScript & jQuery > JavaScript' 카테고리의 다른 글

[JavaScript] 읽기 쉽고, 유지보수하기 쉬운 코드 작성하기 - 코딩규약  (0) 2018.10.12
[JavaScript] email 형식 검사하기  (0) 2018.09.27
[JavaScript] 현재 위치를 지도에 찍어주는 Geolocation  (0) 2018.09.13
[JavaScript] 저장소 사용하기  (0) 2018.09.07
[JavaScript] Session 데이터 읽고, 쓰기  (0) 2018.09.04
//

[Linux] VirtualBox 포트 포워딩을 통해 Apache 서버 접근[Linux] VirtualBox 포트 포워딩을 통해 Apache 서버 접근

Posted at 2018. 9. 25. 16:20 | Posted in Linux
반응형




참고① : http://noota.tistory.com/entry/

참고② : http://blog.daum.net/haanulfafa/7937118




■ 포트 포워딩을 이용한 가상머신속 안의 아파치 서버접근





01. 먼저 설치된 우분투에서 ifconfig를 입력하고, 설정된 IP주소를 확인한다.





02. 버츄얼 박스 관리자에서 아래와 같은 작업에 들어간다.

 ① 연결할 가상머신을 선택하고 마우스 오른쪽 버튼을 클릭한다.

 ② 메뉴 목록이 보이면 설정 버튼을클릭한다.





03. 설정 창이 열리면 다음과 같이 작업을 진행한다.

 ① 좌측메뉴에서 네트워크를 선택한다.

 ② 네트워크 항목에서 고급 버튼을 눌러서 숨겨진 항목을 나타낸다.

 ③ 포트 포워딩 버튼을 클릭한다.






04. 포트 포워딩 창이 뜨면 아래와 같이 작업을 진행한다.

 ① 우측 +버튼을 클릭하여 새 포트 포워딩 규칙을 추가한다.

 ②

이름

프로토콜

호스트IP

호스트 포트

게스트IP

게스트 포트

 

 포트 포워딩 이름

TCP

127.0.0.1

80

접근할 IP 주소

80

 ③ 확인 버튼을 클릭하여 설정을 저정한다.





06. 확인 버튼을 클릭하여 변경한 네트워크 설정을 저장하고 닫는다.





07. 웹 브라우저를 열고 localhost 를 입력하면 가상머신에서 설치한 Apache 서버에 접속한 것을 확인 할 수 있다.











■ 기타 접근이 필요한 포트 포워딩





위의 포스팅에서 아파치 서버를 포트 포워딩을 하여 윈도우의 웹 브라우저에서 아파치 서버의 실행결과를 출력하는 것을 해보았다.


이와 마찬가지로 DB, FTP, SSH등의 연결을 위해 포트를 열어주어야 하는경우에는





위와 같이 PORT(포트)를 추가적으로 열어주면 된다.








반응형
저작자표시
//

[Ubuntu] Ubuntu에 APM 세팅하기[Ubuntu] Ubuntu에 APM 세팅하기

Posted at 2018. 9. 25. 15:40 | Posted in Linux/Ubuntu
반응형



■ 우분투 APM 설치하기



-. APM은 Apache, PHP, MySQL을 줄여서  APM 이라고 한다.

 ① 웹서버로 사용할 Apache서버
 ② 웹 어플리케이션을 동작시키기위한 PHP 인터프린터
 ③ 데이터베이를 이용하기 위한 MySQL






#01. Apache를 설치 하기


 $ sudo apt-get install apache2




위와같이 세팅을 마무리 했다면, 이제 웹 브라우저를 열고


주소창에 http://localhost 혹은 http://120.0.0.1 을 입력해보자.






위 그림처럼 보인다면 Apache 웹 서버가 문제 없이 동작하고 있는 것이다.


만약 위 화면이 보이지 않는다면 원인을 찾아야 한다.





아파치 설치가 완료되었다면 mod_rewrite기능을 활성화 시켜두어야 한다.


mod_rewrite는 규칙 기반으로 URL을 동적으로 전환(redirecting) 및 재작성(rewriting) 할 수 있는 아파치 확장 모듈이다.


웹 개발 프레임워크들이 URL 라우팅 기능을 제공하는데


http://www.example.com/Blog/Posts.php?Year=2006&Month=12&Day=19 과 같이 복잡한 URL 을


http://www.example.com/Blog/2006/12/19/  처럼 깔끔한 URL 로 재작성하는,


쉽게말해 짧게 줄여주는 역할을 수행한다고 생각하면 된다.



 $ sudo a2enmod rewrite 




mod_rewrite 설치가 완료되었는지 아래 명령을 통해 확인해 보자.


아파치를 한번 재시작하고 설치 여부를 확인해 보자.



$ sudo service apache2 restart

 



 $ apachectl -D DUMP_MODULES | grep -i rewrite



rewrite_module ( shared )라고 나타나면 정상적으로 설치된 것이다.







#02. PHP 설치하기



 $ sudo apt-get install php php-common libapache2-mod-php



위와 같이 설치가 완료 되었다면.


PHP가 정상적으로 설치되었는지.


아래와 같이 확인해보자.



 $ php -v



위와같이 설치된 PHP의 버전이 확인되었다면.


빔(VIM)을 사용해 테스트할 *.php 파일을 생성해보자.



 $ vim /var/www/html/phpinfo.php



위와같이 입력하면 빔(VIM) 편집기가 실행되는데


아래와 같이 입력하고


:wq로 저장하고 종료한다.



 <?php

             phpinfo();

 ?>



 :wq




그럼 이제 다시 웹 브라우저를 열고


주소창에 http://localhost/phpinfo.php 라고 입력해 보자.






위와같은 화면이 나타나면 정상적으로 PHP세팅이 완료된 것을 확인할 수 있다.


추가적으로 아래와 같은 명령어들을 입력하고 실행하여 자주 사용되는 PHP 패키지들도 설치해 주도록 하자.



 $ sudo apt-get install php7.2-curl php7.2-xml php7.2-zip php7.2-gd php7.2-mbstring php7.2-intl php7.2-mysql




※ php.ini 설치 경로


 $ sudo vim /etc/php/7.2/apache2/php.ini









#03. MySQL 설치하기



 $ sudo apt-get install mysql-server mysql-client php-mysql



MySQL 설치시는 MySQL의 root 계정의 암호를 입력해야 한다.


이는 우분투 root 계정과는 별도의 MySQL의 root 계정에 대한 암호이다.






암호를 입력해주고 OK 버튼을 클릭하여 설치를 마무리한다.







반응형
저작자표시

'Linux > Ubuntu' 카테고리의 다른 글

[Ubuntu] 신규 계정 생성하기  (0) 2018.11.16
[Ubuntu] Ubuntu FTP 서버 설치 및 설정 변경하기  (2) 2018.11.15
[Ubuntu] 빔(VIM) 사용방법 정리  (0) 2018.07.20
[Ubuntu] 우분투 사용자 권한 설정  (0) 2018.07.20
[Ubuntu] 우분투의 시스템 구조  (0) 2018.07.19
//

티스토리툴바