-
Html, CSS 2017‧08‧01
css3 animation 키프레임 멈추기
CSS3로 키프레임 애니메이션을 작동하다가 멈추고 싶을 때가 있다. 대부분 hover나 Class 를 추가하여 멈추는 동작을 넣고 싶을 경우다. -webkit-animation-play-state: paused; -moz-animation-play-state: paused; -o-animation-play-state: paused; animation-play-state: paused; -webkit-animation: none !important; 맨 마지막 줄에 -webkit-animation: none 이 있는 이유는 아이폰 ios 사파리에서 paused; 동작이 제대로 작동하지 않는다. 그렇기 때문에 대안으로 만들어진 코드이다.
-
WP Tip & Tech 2017‧07‧31
썸네일 url 가져오기 (다른 방식)
if (has_post_thumbnail()) { $thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'thumbnail_name'); echo $thumb[0]; // thumbnail url } 기존 방식으로 가져오지 못할 때 위와 같은 방식으로 썸네일 경로를 가져올 수 있다.
-
WP Tip & Tech 2017‧07‧30
글 제목으로 글 id 가져오기
특정 제목을 가진 글의 아이디를 가져올 때 유용하다. $getPost = get_page_by_title('제목으로 쓰인 글', OBJECT, 'post'); echo $getPost->ID;
-
WP Tip & Tech 2017‧07‧30
목록 구현할 때 포스팅의 slug 값 가져오기
<?php echo $post->post_name; ?> php로 이렇게 출력하면 슬러그(고유주소 뒤에 정의한 마지막 주소)가 노출됨.
-
Php 2017‧07‧28
php - 배열에 값 추가하기
array_push 써서 배열의 마지막에 추가한다. $array = array(); array_push($array, "추가"));
-
Php 2017‧07‧28
php 디버깅 할 때 배열,객체 값 콘솔로 확인
자바스크립트로 종종 console.log 나 console.dir 을 써서 데이터를 확인하는데 php에서는 따로하는 방법을 못찾았다. 그래서 자바스크립트로 연결해서 확인하는 용도로 아래 코드를 썼다. echo '<script>'; echo 'console.dir('. json_encode( $배열 ) .')'; echo '</script>';
-
Php 2017‧07‧28
php 문자열에서 숫자만 치환 (정규식 포함)
숫자만 남기고 나머지는 삭제하고 싶을 때 $date = '2017-11-11'; $getdate = preg_replace('/[^0-9]*/s',"", $date); echo $getdate; //20171111
-
Php 2017‧07‧27
배열안에 해당 값이 존재하는지 체크
배열속에 특정 값이 존재하는지 확인할 때 사용한다. $Array = array(1,2,3,4,5,6,7); if(in_array(7, $Array)) echo "있어요~"; 자세한 추가 설명은 php.net에서 http://php.net/manual/kr/function.in-array.php
-
Reactjs 2017‧07‧21
리액트 라우터 v4 와 코드 스플리팅
리액트는 알다시피 한번에 모든 페이지 정보가 스크립트로 들어감. 그러다보니 방문하지 않을 페이지의 코드까지 로드하니 비효율적일 때가 있다. 해당 페이지로 라우팅되었을 때만 그 페이지 코드를 불러오게 해보자. 사용된 모듈은 react, react-dom, react-router-dom 이다. 리액트 라우터는 v4다. app.js (html에서 불러오는 코드 파일이다.) import React, { PropTypes, Component} from 'react'; import ReactDOM from 'react-dom'; import { BrowserRouter , […]
-
Reactjs 2017‧07‧21
코드 스플리팅을 위한 webpack.config.js , 패키지들
이번에 webpack3, react router v4로 접하면서 코드 스플리팅을 위한 작업을 했다. 설치한 패키지들은 package.json으로 파악하고 설치하면 된다. package.json 의 설치 모듈들 devDependencies": { "babel-core": "^6.25.0", "babel-loader": "^7.1.1", "babel-preset-env": "^1.6.0", "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", "babel-preset-stage-0": "^6.24.1", "express": "^4.15.3", "html-webpack-plugin": "^2.29.0", "webpack": "^3.3.0" }, "dependencies": { "react": "^15.6.1", "react-dom": "^15.6.1", "react-router-dom": "^4.1.2" } webpack.config.js const webpack = require('webpack'); […]