苦手克服！やったことな分野に挑戦【JSON WordPressApi】

コーダーがフロントエンドエンジニアにステップアップするためには、習得しなきゃいけない分野がたくさんあります。

やったことない領域にどんどん挑戦して、できることをう増やしていきましょう。

WordPressのWebAPIを利用してアプリ化を目指す
1. JSON化したデータはjQueryで出力できる
2. Monacaに書いてみる

WordPressのWebAPIを利用してアプリ化を目指す

WordPressで作られたWebサイトをスマートフォンのアプリとして制作してみたいと、前々から思っていたので（需要があるかわかりませんが……）勉強も兼ねて入り口だけでも見つけてみようかと思います。

本来ブラウザで表示されるWordpressで作られたページをWebAPIを利用することで、アプリに流すことができないかということです。

WordPressのWebAPIでいま注目されているものは、JSON REST APIというプラグイン。JSONはデータの保存形式として最近よく使われています。

詳しいことはよくわからないので、とりあえずJSON REST API（プラグイン）をインストールしてみる。

ドメイン/wp-json/ここでAPI化されたJSON形式のテキストでデータを取得できるようになりました。

JSON化したデータはjQueryで出力できる

<ul class="box" id="wpJson">
</ul>
<script>
<!--
	$(document).ready(function(){
		$.getJSON("https://liberty-dock.com/wp-json/posts/",
			function(data) {
				var len = data.length;
				for(var i=0; i < len; i++){
				$('#wpJson').append('<li><a href="'+data[i].link+'">'+data[i].title+'</a></li>');
			}
		})
	});
-->
</script>

うまく表示できました！
jQueryは1系でも2系でもどちらでもいいんですが、アプリ化を目指すなら2系ですね。

jQueryの日本語リファレンスにもjQuery.getJSON( url, data, callback ) の記述がありますので、jQueryがよくわからない人は日本語リファレンスを見て下さい。