Electron 의 장점은 엄청 많은대요. 그 중 하나가 "공통된 브라우저 환경을 가질 수 있다" 입니다. 따라서.. 이것을 이용하여 Electron 으로 웹뷰 만 만든다 하더라도 사용자에게 공통된 경험을 하게 해 줄수 있다는 장점이 되게 되는데요. 여기서는 Electron의 Webview 를 이용하여 페이지를 iframe 과 같이 표시하는 방법을 알려 드리겠습니다. github 소스코드 : https://github.com/TutorialBook/electron-webview-example * Electron의 Webview 는 Iframe 과 다르게 여러가지 규칙들에 대한 옵션을 끄거나 켤 수 있는 기능을 제공합니다. Electron Webview 사용의 이유 ( 개인 ) 우선 제가 웹 서비스 페이지..
Electron 이란? Electron 이란 NodeJS 와 Chromium ( 일반적으로 Chrome 의 소스 로 이해하시면 편함 : 정보 ) 을 조합하여 웹 서버 없이도 PC 에서 웹 서버 + 브라우저 인 것 처럼 구동하는 데스크탑 앱을 만들수 있는 툴을 말합니다. Chromium 기반으로 하기때문에 Chromium 지원하는 OS 들을 지원하는 크로스 데스트탑 앱 플렛폼 이라고 생각하시면 편합니다. 대표적으로 Slack, Jandi, discord, Atom, Visual Studio Code 와 같은 앱들의 데스크탑 버전들이 Electron 을 이용하며 지금도 수 많은 앱들이 개발되고 있습니다. - 정보 : http://electron.atom.io/apps/ - 특징 1. 데스크탑 앱을 웹 서비스..
Laravel 5.3 부터 이전(5.2) 에 사용하던 방식인 Auth/AuthController.php 통합 방식이 변경되어 ForgotPasswordController.php - 비밀번호 찾기 LoginController.php - 로그인 RegisterController.php - 가입 ResetPasswordController.php - 비밀번호 초기화 파일 4개로 쪼개 졌습니다. 각각은 이름대로의 역할을 하는대요. 그렇다면? middleware auth 리다이렉트는 어떻게 처리 해야 되는가? /app/Exceptions/Handler.php 에 보시면 최 하단에 protected function unauthenticated($request, AuthenticationException $except..
Ubuntu 14.04 LTS 버전에서 NodeJS 설치 및 NodeJS 버전을 변경하기위한 n 을 설치하고 변경하는 방법에 관해 설명드리겠습니다. 1. Ubuntu 에서 apt-get 을 이용하여 NodeJS 설치하기 우선 apt-get 을 이용해서 설치할 것 이기 때문에 저장소를 NodeJS 홈페이지에 등록된 방법으로 등록해주시기 바랍니다. 원본 : https://nodejs.org/en/download/package-manager/* npm n 을 통해서 버전을 수시로 변경할 수 있기 때문에 버전에 관해서는 크게 걱정하지 마시고 일단 설치하시기 바랍니다. NodeJS 4.x LTS 버전 curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - ..
Ubuntu 에서 apt 저장소 추가 후 apt-get 을 통해서 nginx 설치시 Stable 버전으로 설치하는 방법입니다. 만약 저장소를 추가하지 않고 그대로 설치 한다면 구버전이 설치되니 참고하시기 바랍니다. ( 필자의 경우 1.8.1 Stable 에서 1.4.6 이 설치되었습니다. ) 우선 아래의 명령어로 nginx/stable 저장소를 추가합니다. sudo add-apt-repository ppa:nginx/stable 그리고 apt-get update 를 해주도록 합니다. 만약 업데이트 마지막에 GPG ERROR NO_PUBKEY 에러가 발생한다면 아래의 포스팅을 참고하시기 바랍니다. 2016/03/01 - [Computer Skills/Ubuntu] - Ubuntu 에서 GPG ERROR N..
여기서는 간단하게 Let's Encrypt 를 이용하여 무료로 HTTPS 를 제공하는 튜토리얼을 진행해보겠습니다. - 무료로 Let's Encrypt 를 이용한 인증서를 만들고 적용 우선 이 문서는 영문 버전을 참고하여 작성한 문서이며 원본은 How To Secure Nginx with Let's Encrypt on Ubuntu 14.04 입니다. 기본적으로 원본 문서보다 설명이 적습니다. 자세한 사항은 원문을 찾아 보시기 바랍니다. 서버 셋팅환경은 Ubuntu NginX 입니다. 1. Let's Encrypt 설치하기 우선 필요한 것들을 설치 하도록 합니다. 이미 설치되어 있다면 굳이 설치 하지 않으셔도 됩니다. $sudo apt-get update $sudo apt-get install git bc ..
Chrome 은 개발자에게 많은 편의사항을 제공하는대요. 여기서 설명하는 디바이스 모드도 그중 하나로 PC 용 Chrome 에서 반응형 웹이나 모바일 웹의 디자인을 확인할 수 있는 방법입니다. 물론 PC로 작업하기 때문에 Javascript 디버깅 및 CSS 임시 수정도 쉽게 가능합니다. 우선 페이지에서 우측 버튼을 클릭 후 '검사'를 눌러서 개발자 모드로 들어가시기 바랍니다. * 예전에는 '요소 검사' 였는데 안 본 사이에 변했네요. FireFox 랑 겹쳐서 그런가... FireFox는 그대로 '요소 검사'를 사용하고 있네요. 그리고 아래와 같이 '검사' 창의 좌측 상단에 있는 모바일 모양의 아이콘을 클릭해주시기 바랍니다. 이제 아래와 같이 디바이스 모드로 변경된 화면을 확인하실 수 있으실 것입니다. ..
Laravel 초기 셋팅시 모든 권한 을 변경하고 .env.example 를 .env 로 복사 후 바로 서버를 확인하시면 아래와 같은 에러를 확인하실 수 있습니다. Error : No supported encrypter found. The cipher and / or key length are invalid. .env 파일에 APP_KEY 가 재대로된 키가 들어가 있지 않기 때문인대요. 아래와 같은 명령어로 .env 를 정상적으로 복사 하셨다면 어플리케이션키를 생성하실 수 있습니다. $ php artisan key:generate $ Application key [9YNGQT5bj6NUYcLU3Yummvnrgr9QN7dX] set successfully. 이제 페이지로 이동해보셔서 아래와 같이 정상적으로..
Laravel 5 는 기본적으로 다국어화 기능이 있습니다. 하지만 이 기능의 경우 app::setLocale() 을 이용하여 언어를변경해 주거나 사용자 언어를 직접 지정해주셔야 하는대요. 여기서는 Session 에 Locale 이 지정되지 않았을 경우 사용자의 언어를 감지하여 Locale 을 지정하는 Middleware 를 만들어 보겠습니다. 우선 Middleware 를 만들어보겠습니다. App/Http/Middleware 로 이동하여 Localization.php 파일을 만들고 아래의 코드를 입력해주도록 합니다.
이미 NginX + PHP 5 가 구성된 서버에서 Codeigniter 를 다운받아서 설정하는 방법입니다. 0. NginX 와 PHP 5 의 설정 방법은 아래를 참고하시기 바랍니다. 2015/03/08 - [웹 개발/WAS + PHP] - Ubuntu 에서 NginX + PHP-FPM 연동하기 2015/03/02 - [웹 개발/WAS + PHP] - Ubuntu 에서 NginX + PHP 설치 ( 연동 ) 하기 1. Codeigniter 설치하기 기본적으로 Codeigniter는 다운받아 설치 하시면 됩니다. 최신 Stable 버전의 주소를 받으신 후 wget 을 이용하시면 됩니다. 아래는 Codeigniter 3.0.2 버전의 예 입니다. 다운로드 링크 : https://codeigniter.com/d..
Composer 는 PHP 의 패키지 관리 툴 이며 프로젝트 단위의 패키지를 주로 관리 할때 사용합니다. 여기 설명하는 내용은 Composer 를 이용해서 운영중인 PHP 서비스에 패키지를 추가 하는 방법입니다. 명령어는 간단히 'composer require 패키지 이름' 입니다. 아래는 Laravel 과 함께 사용한 간단한 예제 입니다. $ composer require predis/predis ( 패키지 이름 ) Laravel 에서 Redis 를 사용하기 위한 predis/predis 를 설치한 모습입니다.
지난번에는 간단히 HTML 문서를 만들어 봤는대요. 이번에는 몇가지 태그에 대해 알아보고 사용해보겠습니다. 2015/09/14 - [웹 개발/HTML] - HTML 이란? 첫 HTML 문서 작성하기 우선 HTML 문서는 아래의 기본적인 규칙들을 따라 주셔야 합니다. 1. 문서의 처음은 로 정의해줄 것 ( 문서의 HTML 버전에 따라 다르지만 앞의 DOCTYPE html 는 HTML 5 임을 뜻합니다. ) 2. 문서는 의 안에 넣어 주도록합니다. 3. 사용자들이 보는 부분은 에 작성됩니다. 4. 아래는 최종 결과 예제 파일 입니다. 이제 간단히 태그와 코드를 보도록 하겠습니다. Heading Tag Paragraph Tags 위의 문서에 간단히 주석과 함께 문서를 만들어 봤습니다. * 주석이란? 주석은 개..
PHP 를 이용하여 와 같은 특수문자를 HTML 요소로 변경하는 방법입니다. 일단 변경하는 이유에 대해서 간단히 설명드리자면 페이지에 특수문자를 표현하고 싶을때 HTML 문서에 그대로 와 같이 써버리신다면 브라우져는 테그로 인식해서 를 표현해주지 않습니다. 써주는 방법은 특수문자를 html 코드로 적어주는 방법인대요. 는 코드로는 과 같습니다. PHP 에서는 htmlentities 로 특수문자를 html 코드로 변경하는 것이 가능합니다. 간단한 사용방법으로는 htmlentities 를 그대로 써주시면 됩니다.사용 테스트는 Tutorialbook.IO PHP htmlentities 에서 가능합니다. 위와 같이 사용하시면 HTML 요소 코드에는 © Welcome to Tutorial..
NodeJS 를 이용한 웹 프레임워크 중 하나인 Express ( http://expressjs.com/ ) 의 기본적인 사용방법에 관한 튜토리얼 입니다. 우선 준비사항으로 NodeJS 가 설치 되어있어야 하니 아래의 포스팅을 참고하시기 바랍니다. [Programming Language/NodeJS] - Ubuntu 에서 Node JS 시작하기 [Programming Language/NodeJS] - NodeJS 업데이트 하기 1. Express 간단히 설치하여 HelloWorld 까지 해보기 여기서는 간단히 Express 를 설치하여 간단히 이용하는 방법에 관해서 설명 드리겠습니다. 우선 원하는 이름으로 app 폴더를 생성해 주도록 합니다. 여기서는 developers 로 생성 하였습니다. $ mkdi..
PHP 기본 문법 PHP 는 기본적으로 *.php 의 확장자를 가지며 스크립트는 사이에 작성 됩니다. PHP 파일에는 HTML 코드가 같이 포함될 수 있습니다. 아래의 예제를 한번 보시겠습니다. echo 는 PHP 내부의 스크립트로 텍스트를 출력해주는 역할을 합니다. 또한 echo 의 끝에 세미콜론 ( ; ) 으로 마무리 된 것을 확인하실수 있으실 것 입니다. 프로그램 문단의 끝은 항상 세미콜론 으로 끝을 내주셔야 합니다. * 아직 초반이라 PHP 에 관해서 HTML 과 함께 쓰도록 배우지만 굳이 HTML 을 포함하는 프로그래밍 언어로서만 사용하지는 않습니다. 물론 대부분의 경우가 HTML 표현을 위해서 사용되지만 서버의 뒷단에서 Perl, Python 과 같이 서비스 운영을 처리하는 역할을 하기도 한다..
PHP 는 동적 웹페이지를 만들수 있는 서버 사이드의 스크립트 언어이며 HTML 코드안에 php 를 넣음으로서 효율적으로 개발이 가능합니다. 또한 PHP 는 OS 에 관계 없이 운영 및 개발이 가능합니다. * PHP 를 알아보기전 기본적으로 HTML, CSS, Javascript 에 관한 지식이 있으셔야 합니다. 우선 간단하게 아래의 PHP 코드를 보겠습니다. 간단히 코드에 관해서 간단히 설명하자면 echo ""; 는 html 페이지내에 텍스트를 뿌려주는 역할을 합니다. 후에 print 와 비교하여 좀더 자세히 설명드리겠습니다. 위의 코드에서 보시면 사이에 부분이 보이실 것 입니다. php 는 이와 같이 HTML 문서 중간에 삽입될 수 있으며 뿐만 아니라 문서 어느 곳 이든 삽입이 가능합니다. 대신 WA..
이 포스트는 : http://deok.me/84 로 이전 되었습니다. 여기서는 MariaDB ( MySql ) 에서 데이터베이스 (DB) 를 확인 ( show ), 사용 ( use ), 생성 ( create ), 삭제 ( drop ) 에 관해서 간단히 알아 보겠습니다. 1. 데이터베이스에 접속 후 데이터베이스 확인하기 우선 처음 데이터베이스를 설치 후 root 계정으로 접속하신 후 show databases; 를 입력하시면 아래와 같이 데이터 베이스들을 확인하실 수 있습니다. 관련 튜토리얼 : MariaDB 설치하기 MariaDB [(none)]> show databases; 처음 설치 후 바로 확인하시면 위와 같이 기본 데이터베이스 들만이 있는대요. 위의 데이터베이스들은 특별한 지식이 있으시지 않으시다..
이미 jdk 가 설치된 상태에서 PhpStorm 이 아래와 같이 java 를 설치해 달라는 에러가 날 수 있습니다. 이유는 Apple 에서 지원하는 JVM 1.6 이 아닌 Oracle 1.6 이상의 버전이라서 그런대요. ( JAVA 가 설치 되어 있지 않다면 승인 으로 설치 혹은 Oracle JAVA 설치하기 로 설치 하시면 됩니다. ) 해결 방법은 아래와 같이 패키지 내부 EX) /Applications/PhpStorm.app/Contents/Info.plist 로 들어가서 JVMVersion 의 string 을 수정해주시면 됩니다. 위와 같이 우클릭 > 패키지 내용 보기 로 들어간 후 Contents > info.plist 를 수정할 수 있는 에디터로 열어 줍니다. 그리고 JVMVersion 을 검색..
Windows 프로그래밍을 하기위해서 주로 사용하는 프로그램인 Visual Studio 는 원래 유료 였는대요. 최근 시장의 변화 때문인지 Android 도 지원하고 무료로 제공하는 등의 변화를 거쳐가고 있는 듯 합니다. 이전에도 Express라는 버전으로 기능제약이 심한 무료 버전이 있었지만 2014년 11월쯤 부터 기능제약이 거의 없는 Community 버전이 무료로 제공되기 시작했습니다. 관련 자료 다운로드 및 링크 : https://www.visualstudio.com/products/visual-studio-community-vs 위의 링크에서 보시면 아래와 같이 Q&A를 보실수 있는대요. 간단히 설명드리자면1. 개인 개발자는 Visual Studio Community 를 이용하여 무료 또는 유..
요즘 많은 프로젝트 들이 그렇지만 Phalcon 역시 기본 프로젝트를 만드는 툴이 있습니다.여기서는 간단하게 Ubuntu + NginX + PHP 환경에서 설치하고 사용하는 방법에 대해서 설명드리겠습니다. 1. git clone 을 통해서 다운받기 및 심볼릭 링크 생성 일단 원하시는 폴더로 이동 후 git clone 을 이용햐서 phalcon-devtools 를 다운받습니다. git clone https://github.com/phalcon/phalcon-devtools.git cd phalcon-devtools 그리고 폴더로 이동 후 phalcon 에 대한 심볼링 링크를 생성하여 주도록합니다. ln -s 경로/phalcon-devtools/phalcon.php /usr/bin/phalcon chmod ..
Ubuntu + NginX + PHP-FPM 설치는 아래의 링크를 참고 하시기 바랍니다.Ubuntu 에서 NginX + PHP-FPM 연동하기 PHP Framework 중 최강의 속도(?!)를 자랑한다는 Phalcon 의 설치 방법입니다. 우선 NginX + PHP-FPM 기본 설치를 기반으로 하며 위의 링크를 참고 하시기 바랍니다. 1. 기본 의존성 패키지 설치하기 아래의 명령어로 Phalcon 을 설치하기전 기본적으로 설치하기 위해 필요한 준비물들을 설치 합니다. sudo apt-get update sudo apt-get install git-core gcc autoconf make sudo apt-get install php5-dev php5-mysql 2. 다운받기 및 설치 원래는 Phalcon ..
Ubuntu 서버를 이용하여 NginX 와 PHP 를 연동하여 웹 서버를 구성하는 방법입니다. *예제는 쉽게 설치하기 위해 apt-get 을 이용합니다. 1. Ubuntu 패키지 저장소 업데이트 하기 우선 Ubuntu 의 패키지저장소를 최신으로 업데이트 하기 위해서 아래의 명령어로 python-software-properties 과 software-properties-common ( Ubuntu server 12.10 일 경우만 software-properties-common 을 설치 합니다. ) 을 설치해 주도록 합니다. sudo apt-get install python-software-properties sudo apt-get install software-properties-common ( 버전에 ..
Python 을 HelloWorld 로 간단하게 시작하는 튜토리얼 입니다. 아래의 예제는 MAC 에 기본설치된 Python을 기본 설정으로 합니다. 1. Python 으로 HelloWorld.py 작성하기 $ vim HelloWorld.py print "Hello, World!" 2. HelloWorld.py 실행하기 $ python HelloWorld.py 아래는 콘솔에서 정상적으로 출력된 모습입니다. 시작이 반입니다,
Cocos2D-X 및 여러 게임 엔진에서 사용할수 있는 PhysicsEditor 를 사용할수 있는 1년 라이선스를 공식적으로 받는 방법입니다. 방법은 바로 이전에 작성한 TexturePacker 와 같습니다. 이곳에도 작성하겠지만 궁금하신 분들은 아래의 링크를 확인해 보시기 바랍니다. ^^ 링크 http://www.tutorialbook.co.kr/94 조건은 우선 운영중인 블로그가 있어야 합니다. 그리고 공식적인 조건으로는 - 게임 / 소프트웨어/ 웹 개발 관련 블로그를 작성하고 있으셔야 합니다.- 블로그는 최근의 글 5개 항목들이 6개월 을 넘어서는 안됩니다.- 페이스북, 트위터, 텀블러, 웨이보는 블로그로 보지 않습니다 - 여러분의 친구가 10만명이 넘지 않는이상은... 뭐 홈페이지에 접속하면 대략..
CentOS 에 Yum 으로 간단하게 Mysql 을 설치하는 방법입니다. 1. Yum 으로 Mysql 설치하기 $yum install mysql-server 2. mysql 시작하기 $service mysqld start 위와 같이 실행하여 정상적으로 메세지가 실행되었다면 준비가 된것입니다. 첫 실행시 위와 같이 비밀번호에 관한 설정이야기가 출력되는대요. 이는 처음 설치 하였을때 root 에 관한 비밀번호가 설정되지 않아서 입니다. 3. root 비밀번호 생성 처음 실행할때도 나오지만 아래의 명령어로 비밀번호 생성이 가능합니다. $mysqladmin -u root password 비밀번호 4. 접속 테스트해보기 이제 Mysql 접속 명령어로 접속을 테스트 해보도록 합니다. $mysql -u root -p..
Sublime Text 에서 자동으로 버전을 체크하여 업데이트를 추천하는 기능을 막는 방법입니다. 업데이트는 아래와 같이 뜨는대요. 업데이트를 하기 싫을 경우 아래와 같이 "update_check":false 를 설정에 추가해 주시면 됩니다. 저는 사용자 설정으로 했지만 Default 설정으로도 가능할 것입니다. 설정에서 아래와 같이 "update_check":false 를 추가해 주시면 됩니다. 위와 같은 셋팅 파일에서 update_check 설정을 추가해 줍니다.
jQueryMobile 에서 이벤트가 2번씩 발생할때가 있습니다. ( jQuery Mobile 의 페이지 관리 특성에 따라 특정 오브젝트에 이벤트가 중복해서 들어 갈수 있습니다. ) 개발 로직에 따라서 피해 갈수도 있지만 정말 ... 어쩔수 없는경우 중복 이벤트를 해결하는 방법으로 .off() 를 이용하실수 있습니다. 오브젝트에 이벤트를 연결하는 .bind 전에 ( 혹은 .click .mouseover 등등... ) .off 를 넣어 주실수 있습니다. 간단하게 보자면 $(".logo").bind("touchstart",function(){ if(btnStatus == 'true'){ var id = $.mobile.activePage.attr('id'); if(id != "MAIN"){ $(".uiBlo..
이번 버전에서는 ANT 로 인해서 문제가 생기지는 않았던것 같은대 오늘 Phonegap 을 OS 패치 후 Android를 빌드 하던 중 ANT 를 요청하는 메세지를 발견해서 간단하게 포스팅합니다. 1. ANT 다운받아 설치 하기 ANT 홈페이지 Download 로 이동하여 파일을 다운받습니다. http://ant.apache.org/bindownload.cgi 그리고 다운로드 받은 파일의 압축을 풀어 주고 Terminal 을 실행하도록 합니다. ( Terminal 에서 압축을 푸실분은 푸셔도 됩니다. 여기서는 압축을 푼 후 카피를 실행합니다. ) $ cp -rf /PATH/apache-ant-1.9.2 /usr/local/ 위와 같은 명령어로 복사합니다. 정상적으로 실행되었다면 /usr/local 에 a..
Ubuntu 에서 timezone 이 개발자가 생각한 시간 ( 보통은 서비스 시간 )이 아닐경우 timezone 을 변경해줘야 하는대요. 여기서는 간단하게 Ubuntu 에서 제공하는 방법을 이용해 보도록 하겠습니다. 우선 링크에 있는 방법으로도 시간을 교정했는대도 시간이 맞지 않을 경우 아래의 명령어로 표준 시간대 ( timezone )를 확인해보시기 바랍니다. $more /etc/timezone 아래의 그림에서 확인해보시면 date 시간이 완전히 다릅니다. more /etc/timezone 명령어로 확인결과 표준 시간대가 America/New_York 로 되있는것을 확인하실수 있습니다. timezone 수정 방법은 간단합니다. 아래의 명령어로 timezone 재설정 패널을 띄운 후 원하시는 시간대로 설..
- Total
- Today
- Yesterday
- 서버
- 개발자
- Developer
- 웹 개발
- 우분투
- 에러
- 게임
- Laravel
- 데이터베이스
- 웹 서버
- 튜토리얼북
- 맥
- 웹 개발자
- html
- it
- 개발
- 웹
- 인터넷
- 게임 개발
- SNS
- 서버 개발
- 설치
- ubuntu
- Tutorialbook
- cocos2d-x
- JavaScript
- Database
- php
- mac
- Nodejs
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |