먼저 장점, 사용법을 설명하자면

<!DOCTYPE html>
<html>
<head>
...생략...
</head>

<body>
<?php foreach($menus as $menu){
    echo $menu;
}?>

</body>
</html>

위와 같이 써야할 것을

<!DOCTYPE html>
<html>
<head>
...생략...
</head>

<body>
@foreach($menus as $menu)
    {{ $menu }}
@endforeach

</body>
</html>

이렇게 쓸 수 있다.



blade templete은 laravel에서 제공하는 템플릿 엔진으로

@로 사용해도 되고, 그냥 php문으로 작성해도 된다.

blade view는 .blade.php 확장자를 사용한다.

처음 라라벨을 설치하고 welcome.blade.php라고 되어있길래 뭔가했더니만 바로 이거였다!

저작자표시 비영리 동일조건

'Programming > PHP' 카테고리의 다른 글

[laravel] 아마존 AWS ubuntu에 APM(Apache+PHP+Mysql)설치부터 laravel5까지  (0) 2016.11.03
[laravel] mac에서 라라벨 설치하고 실행하기  (0) 2016.04.20

APM(Apache + PHP + Mysql)설치부터 라라벨 설치까지는

http://hplayground.tistory.com/79 여길 참고



1. composer 설치하기

laravel을 본격적으로 설치하기 전 composer부터 설치해야한다.

composer은 의존성 관리도구로

이해하기 쉽게 설명하자면 내가 원하는 기능은 명령어 한줄로 빠르게 설치할 수 있는 것이다.

node.js를 공부했다면 npm같은 역할이라고 알아두면 된다.

homebrew로 php를 설치하면 되던데

자세한 설치방법은 http://haruair.com/blog/1860 요기에 매우 잘 정리되어있는 것 같다

난 라라벨 설치만 정리할거니까..



2. composer를 이용해 라라벨 설치

composer global require "laravel/installer"
composer create-project laravel/laravel --prefer-dist

라라벨 프레임워크가 설치될 폴더로 이동한 후 위의 명령어들을 입력한다

나는 Desktop -> laravel 폴더로 이동한 후 위의 명령어들을 입력해 주었다.


그러면





요렇게 laravel폴더 안에 진짜 laravel이 들어있게 된다.



3. 서버 실행해서 잘 설치됐나 확인하기

php artisan serve

그냥 간단하게 서버 키려면 위의 명령어로(자동으로 포트는 8000)

php artisan serve --port=8080

포트를 지정해서 서버를 키려면 위의 명령어로(나는 8080으로)


그럼 터미널창엔 요렇게 뜨고 localhost:8080으로 접속하면


 뜨든!

저작자표시 비영리 동일조건

'Programming > PHP' 카테고리의 다른 글

[laravel] 아마존 AWS ubuntu에 APM(Apache+PHP+Mysql)설치부터 laravel5까지  (0) 2016.11.03
[laravel] welcome.blade.php? blade view  (0) 2016.04.25

서브라임텍스트에서 젠코딩(emmet)과 sftp, 테마 등을 사용하기 위해 반드시 설치해야하는 것이 있다

바로 패키지 컨트롤(package control)!

여기선 emmet과 sftp설치만 다루도록 하겠음


sublime text2와 sublime text3이 다르니 주의하면서 시작하겠음



1.

서브라임텍스트에서 윈도우는 Ctrl + `   맥에서는 control + `를 누른다

참고로 `는 1 왼쪽에 있는 기호임

그럼 위의 사진처럼 하단에 cmd창같은게 생긴다




2.

import urllib2,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')

요 내용을 cmd창 입력란에 붙여준다





3.  성공했으면 서브라임을 다시 시작하라는 문구가 보인다 그럼 껐다 다시키면됨





4. 

윈도우는 ctrl + shift + p, 맥은 command + shift + p

또는 메뉴에서 Preference ->package control를 들어가면 위처럼 보인다

Package Control: Install Package 를 선택한다





5.

나는 다 설치해서 목록에 보이진 않지만

젠코딩을 원하면 emmet을

sftp를 원하면 sftp를 선택하여 설치하면 끝!



간단데스네



저작자표시 비영리 동일조건

'Sublime Text' 카테고리의 다른 글

[sublime text] sftp 단축키  (0) 2016.03.10
Sublime text sftp 아마존 연결방법  (0) 2015.12.30
출처 : https://wbond.net/sublime_packages/sftp/usage#command-Sync_Both_Directions

Upload File
Win/Linux: ctrl+alt+u+f
OS X: ctrl+cmd+u+f
Upload the current file

Upload Changed Files
Win/Linux: ctrl+alt+u+c
OS X: ctrl+cmd+u+c
Upload all files changed or created since the last commit to your VCS (SVN, Git or Hg)

Upload Open Files
Win/Linux: ctrl+alt+u+n
OS X: ctrl+cmd+u+n
Upload all open files that are configured with an SFTP/FTP remote

Download File
Win/Linux: ctrl+alt+u+o
OS X: ctrl+cmd+u+o
Download the remote version of the selected file and overwrite the local copy

Upload Folder
Win/Linux: ctrl+alt+u+r
OS X: ctrl+cmd+u+r
Uploading the entire folder the current file is located in can be accomplished by pressing ctrl+alt+u+r on Windows and Linux, or ctrl+cmd+u+r on OS X.

Download Folder
Win/Linux: ctrl+alt+u+e
OS X: ctrl+cmd+u+e
Download the entire folder

Diff Remote File
Win/Linux: ctrl+alt+u+i
OS X: ctrl+cmd+u+i
Download the remote version of a file to a temp location and diff it with the local version

Rename Local and Remote Files
Context menu only
Rename the file on the server as well as the local copy

Delete Remote File
Context menu only
Delete the file off of the server

Delete Local and Remote Files
Context menu only
Delete the file off of the server in addition to the local copy

Sync Local -> Remote
Win/Linux: ctrl+alt+u+y
OS X: ctrl+cmd+u+y
Compare file modification times and confirm actions before uploading the selected file or folder. This will also delete files off of the remote server that do not exist locally.

Sync Remote -> Local
Win/Linux: ctrl+alt+u+d
OS X: ctrl+cmd+u+d
Compare file modification times and confirm actions before downloading the selected file or folder. This will also delete files off of the local machine that do not exist remotely.

Sync Both Directions
Win/Linux: ctrl+alt+u+b
OS X: ctrl+cmd+u+b
Compare file modification times and confirm actions before uploading/downloading the selected file or folder. This will never delete files, and will always perform the action that causes the newest file to be present in both locations.

Monitor File
Win/Linux: ctrl+alt+u+m
OS X: ctrl+cmd+u+m
Watch the file for modifications (from Sublime or other applications). When the file modification time changes, the file will be uploaded. This was designed to be used with programs such as LiveReload and CSS compliers. The file must remain open in Sublime to be monitored. Once it is closed, monitoring stops.

Browse Remote
Win/Linux: ctrl+alt+u+w
OS X: ctrl+cmd+u+w
Open the server quick panel browser at the remote folder corresponding to the selected file or folder


Server Workflow

Setup Server
Win/Linux: ctrl+alt+r+s
OS X: ctrl+cmd+r+s
Setup a new server.

Browse Server
Win/Linux: ctrl+alt+r+b
OS X: ctrl+cmd+r+b
List the servers, with an option to setup a new one.

Last Server
Win/Linux: ctrl+alt+r+n
OS X: ctrl+cmd+r+n
Show the current directory listing for the last used server.

Edit Server
Win/Linux: ctrl+alt+r+e
OS X: ctrl+cmd+r+e
List the servers for the purpose of editing.

Delete Server
Win/Linux: ctrl+alt+r+d
OS X: ctrl+cmd+r+d
List the servers for the purpose of deletion.


Both Workflows

Show SFTP Panel
Win/Linux: ctrl+alt+u+s
OS X: ctrl+cmd+u+s
Show the SFTP activity panel

Cancel
Win/Linux: ctrl+alt+u+x
OS X: ctrl+cmd+u+x
Stop the current SFTP/FTP server activity (connection, upload or download)


저작자표시 비영리 동일조건

'Sublime Text' 카테고리의 다른 글

Sublime Text package control(emmet, sftp)  (0) 2016.03.10
Sublime text sftp 아마존 연결방법  (0) 2015.12.30

처음 작성된 html코드는

$("#target").on("click", function(){
    이벤트
});

이런식으로 작성하면 이벤트가 잘 먹었다.

근데 append나 prepend, before, after로 생성한 태그에는 이벤트가 먹지 않았음! 주륵


열심히 구글링 한 결과 저 코드를 조금만 응용하면 된다고 함(참고로 1.7 이후버전)

$(document).on("click", "#target", function(){
    이벤트
});


대충 정리하면

$(document).on(1, 2, 3)

1 -> click, mouseover, keyup 등의 이벤트

2 -> 타겟태그(#은 id, .은 class)

3 -> 함수

저작자표시 비영리 동일조건

'Programming > JavaScript/JQuery' 카테고리의 다른 글

url(path)을 비교하여 메뉴 active 하기  (0) 2018.08.13
iframe youtube 재생, 일시정지, 중지 제어  (0) 2017.07.27
[모바일웹] 메인메뉴를 터치 슬라이드 방식으로 만들기  (1) 2017.01.16
웹에 파워포인트(PPT) 띄우기  (0) 2015.12.28
[jquery] 10가지 태그 클라우드 플러그인  (0) 2013.03.13
[jquery] jquery모음 사이트  (0) 2013.03.12
[jquery] 퀵메뉴  (0) 2013.03.05
[jquery] 마우스오버로 커졌다가 작아졌다  (0) 2013.03.05

참고 및 공부 - https://blog.outsider.ne.kr/572


난 깃허브 완전 초짜이다...

처음엔 commit을 때렸는데 Changes not staged for commit 이랑 no changes added to commit 가 자꾸 뜨고 커밋이 안됨

그리고 우여곡절끝에 커밋을 했는데 막상 github 사이트를 보면 반영이 안되어 있었음

하지만 구글링으로 문제를 해결함!!


참고로 git에는 저장소가 3가지가 있다고 함

1. 소스가 보관되는 저장소

2. 현재 프로젝트 파일들이 있는 작업트리

3. 커밋될 대상이 저장되는 스테이지


알고보니 commit을 때리기 전에 add를 하여 스테이지 영역에 올려놓아야 한단다





1. 

git status

를 이용해서 변경됐지만 아직 커밋이 안된 파일들의 목록을 쫙 뽑아준다



2.

git add 파일경로

로 스테이지 영역에 올려놓음!

status를 통해 public/css/common.css 가 아직 커밋안됐다는것을 알았으면

git add public/css/common.css

를 해주면 됨!



3.

git commit -m '커밋메시지'

를 하면 일단 커밋이 된다!



4. 마지막으로

git push

를 하고 github 아이디(이메일말고)랑 비밀번호 치면 끝

앙 기모띠




참고로 add하고 commit하는게 귀찮으면

commit할때 -m 옵션대신 -a 옵션을 주면 add와 동시에 commit이 된다고 함!


또는 git add -u를 하면 변경됐지만 아직 커밋안된 파일들이 쫙 스테이지영역에 올라감

그니까 add를 몇번씩 하지 않아도됨


저작자표시 비영리 동일조건

'Programming' 카테고리의 다른 글

apache 확장자(.php .html) 없이 접속할 수 있도록 설정  (0) 2017.07.06
키(pem)path 입력안하고 바로 ssh 연결하는 방법  (0) 2016.11.01
zopim으로 내 웹사이트에 채팅 붙이기  (0) 2016.07.21
맥 터미널에서 ssh 접속하기  (0) 2016.07.11
[git] git에 있는거 local로 가져오기(clone, checkout)  (0) 2016.07.04
톰캣 초기 설정하기  (0) 2015.12.28
APM SETUP 초기 설정하기  (0) 2015.12.28

나는 마우스오버했을 때 버튼이 돌아가는걸 만들었다.

서론 필요없고 소스부터

#chatBtn {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: url("/images/btn_chat.png") no-repeat center #9736e5;
}
#chatBtn:hover {
	background-color: #A13AF5;
	-webkit-animation:spin 3s linear infinite;
	-moz-animation:spin 3s linear infinite;
	animation:spin 3s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

infinite속성은 끊임없이 반복하기위함

한번만 돌게하려면 infinite는 빼면된다


아래는 적용한 예제임



저작자표시 비영리 동일조건

'Programming > CSS' 카테고리의 다른 글

텍스트 영역 선택(드래그) 방지  (0) 2018.03.30
미디어 쿼리 정의부터 예제까지  (0) 2015.12.28
CSS 미디어쿼리로 print mode  (0) 2015.12.28
꼭 알아야할 CSS Tip  (0) 2013.03.13
css 초기화 선언  (0) 2013.02.26

내 맥은 진짜 빠가인듯

아니 왜 mysql을  brew로 설치해도 pid에러를 내뿜는것인가... 주륵

그래서 임시방편으로 MAMP를 깔아서 요 mysql을 공유하기로 결정!

나중에 진짜서버로 옮길땐 설정만 바꾸면 되는거니까ㅋㅋ


1. 

/app.js

...
var func = require('./routes/func');
...
app.use('/addMember', func); 
...

요 위에 두줄을 적절히 app.js에 적어주고


2.

/routes/func.js

var mysql = require('mysql'); 
var connection = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "root",
    database: "code",
    port: 8888,
    socketPath: '/Applications/MAMP/tmp/mysql/mysql.sock'
});
connection.connect(function(err) {
    if (err) {
        console.error('mysql connection error');
        console.error(err);
        // throw err;
    }
});
app.js에 적은 이름이랑 같게 js파일을 만들어주고

위에 저런식으로 넣어주었음


일단 MAMP설치하고 보니까 8888포트를 사용하고 있었음

그래서 port: 8888을 적어주었고

MAMP의 디폴드 계정정보는 아이디 root, 비밀번호 root 임 그래서 저렇게 해주었음

database는 생성한 db이름 적어주면 되고

제일중요한 소켓패쓰! MAMP의 mysql.sock이 있는 경로로 지정해주어야함


저작자표시 비영리 동일조건

'Programming > node.js' 카테고리의 다른 글

[node.js] ejs 설치  (0) 2016.02.18
[node.js] express 설치 및 시작  (0) 2016.02.18

node.js의 ejs는 템플릿 엔진 모듈이다.

ejs말고 jade를 사용하는 경우가 있는데

ejs가 일반 asp, jsp, php와 사용방법이 비슷해 협업하기도 좋고 이해도 쉽다.


1. express 설치(http://hplayground.tistory.com/64) 완료 후 finder에서 작업폴더로 이동 후 

npm install ejs

ejs사용을 위해 ejs를 내려받는다.

node_modules폴더 안에 ejs폴더가 생성되면 잘 설치된 것

저작자표시 비영리 동일조건

'Programming > node.js' 카테고리의 다른 글

[node.js] MAMP의 mysql을 express에 연결하기  (0) 2016.02.23
[node.js] express 설치 및 시작  (0) 2016.02.18

node.js에 대해서 쌩판 모르다 보니 설치부터 난관에 봉착했다.

먼저 나는 맥환경에서 작업하였음을 참고하고

node.js는 https://nodejs.org/en/ 에서 pc환경에 맞게 다운받았다.


1. 터미널을 켜서

sudo npm install -g express-generator

또는

npm install express

를 친다

-g 옵션이 어느 폴더에서나 사용가능하게 하는 것 같고

express-generator를 쓴 이유는

express만 치니 자꾸 express를 못찾는단다 주륵 (에러내용 -> -bash: express: command not found)

sudo 패스워드는 아시다시피 맥 패스워드(아이클라우드 패스워드)


2. 작업할 폴더로 들어가서 (cd 폴더이름 -> ex)) cd test)

express

를 친다


destination is not empty, continue? [y/N]

라고 물어보는데 요건 해당 폴더가 안 비어있다는 말임

y를 하면 그냥 그대로 진행하는거고 N을 하면 새로운 폴더 생성해서 들어가 다시 2번을 시도해야 한다.


2번까지 하고나면 express를 위한 폴더와 파일들이 자동으로 생성된다.

(app.js, bin, public, routes, views, package.json)



참고로 public폴더에는 css, js와 같은 것들

routes폴더에는 back단 js파일

views에는 화면에 보여지는 파일들 예를들어 ejs파일

이 들어간다.





3. 터미널에

node app.js

를 친다.

throw err;

Error: Cannot find module '설치안된모듈'

이런식으로 뜰텐데

그럼 

npm install 설치안된모듈

을 하나하나 치면 됨

(수정)하나하나 저렇게 치거나

npm install

위와같이 그냥 install만 하면 설치안된모듈들 한번에 다 설치해줌

그냥 npm install만 치는게 정신건강과 손가락건강에 이로움


4. app.js를 수정할 차례!

var http = require('http');

를 맨위 변수들과 함께 선언해주고

http.createServer(app).listen(8000, function(){
    console.log('server running...');
});
를 적어서 node app.js를 하면 8000번 포트로 서버가 켜지도록 한다

물론 8000은 내가 임의로 포트를 정한거고

알맞게 수정해서 사용하면됨

저작자표시 비영리 동일조건

'Programming > node.js' 카테고리의 다른 글

[node.js] MAMP의 mysql을 express에 연결하기  (0) 2016.02.23
[node.js] ejs 설치  (0) 2016.02.18

+ Recent posts

티스토리툴바