{"id":42206,"date":"2023-02-13T18:02:21","date_gmt":"2023-02-13T09:02:21","guid":{"rendered":"https:\/\/kinsta.com\/jp\/?p=42206&#038;preview=true&#038;preview_id=42206"},"modified":"2023-08-26T00:19:39","modified_gmt":"2023-08-25T15:19:39","slug":"nextjs-vs-react","status":"publish","type":"post","link":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/","title":{"rendered":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09"},"content":{"rendered":"<p>\u73fe\u4ee3\u306e\u30a6\u30a7\u30d6\u958b\u767a\u30b7\u30fc\u30f3\u306f\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/javascript-libraries\/\">JavaScript\u306e\u30e9\u30a4\u30d6\u30e9\u30ea<\/a>\u3084\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306b\u4e8b\u6b20\u304f\u3053\u3068\u304c\u3042\u308a\u307e\u305b\u3093\u3002\u4e2d\u3067\u3082\u4eba\u6c17\u306e\u30e9\u30a4\u30d6\u30e9\u30ea\u306e1\u3064\u304c<a href=\"https:\/\/kinsta.com\/jp\/blog\/what-is-react-js\/\">React<\/a>\u3067\u3059\u3002Facebook\uff08\u73feMeta\uff09\u304c\u6a5f\u80fd\u8c4a\u5bcc\u306a\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u69cb\u7bc9\u3092\u652f\u63f4\u3059\u308b\u305f\u3081\u306b\u958b\u767a\u3057\u307e\u3057\u305f\u3002React\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306f\u5f93\u6765\u3001\u30a6\u30a7\u30d6\u30d6\u30e9\u30a6\u30b6\u4e0a\u3067\u52d5\u4f5c\u3059\u308b\u3082\u306e\u3067\u3059\u304c\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/next-js\/\">Next.js<\/a>\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306f\u3001JavaScript\u30e9\u30f3\u30bf\u30a4\u30e0\u74b0\u5883<a href=\"https:\/\/sevalla.com\/application-hosting\/\">Node.js<\/a>\u3092\u901a\u3058\u3066React\u306e\u6a5f\u80fd\u3092\u30b5\u30fc\u30d0\u30b5\u30a4\u30c9\u306b\u62e1\u5f35\u3059\u308b\u5b58\u5728\u3067\u3059\u3002<\/p>\n<p>\u3053\u306e\u8a18\u4e8b\u3067\u306f\u3001Next.js\u3068React\u306e\u5f79\u5272\u3084\u7528\u9014\u306a\u3069\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<p><strong><a href=\"https:\/\/www.youtube.com\/watch?v=msJicleNHkA\">Next.Js\u3068React\u306b\u3064\u3044\u3066\u306e\u52d5\u753b\u3067\u306e\u8aac\u660e\u3082\u3054\u7528\u610f\u3057\u3066\u3044\u307e\u3059<\/a>\u3002<\/strong><\/p>\n<p><kinsta-video src=\"https:\/\/www.youtube.com\/watch?v=msJicleNHkA\"><\/kinsta-video><\/p>\n<h2>Next.js\u3068React\u2500JavaScript\u3092\u6b21\u306e\u30ec\u30d9\u30eb\u306b<\/h2>\n<p>2022\u5e74\u306eSlashData\u306e\u8abf\u67fb\u306b\u3088\u308b\u3068\u3001\u4e16\u754c\u4e2d\u306b1,700\u4e07\u4eba\u4ee5\u4e0a\u306e<a href=\"https:\/\/kinsta.com\/jp\/blog\/what-is-javascript\/\">JavaScript<\/a>\u30d7\u30ed\u30b0\u30e9\u30de\u30fc\u304c\u304a\u308a\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/python-vs-java\/\">Python\u3084Java<\/a>\u306e\u3088\u3046\u306a\u4eba\u6c17\u8a00\u8a9e\u306b\u5dee\u3092\u3064\u3051\u3066\u3044\u308b\u3053\u3068\u304c\u308f\u304b\u308a\u307e\u3059\u3002JavaScript\u306f\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u5074\u3068\u30b5\u30fc\u30d0\u30fc\u5074\u306e\u4e21\u65b9\u3067\u4f7f\u7528\u3067\u304d\u308b\u305f\u3081\u30011\u3064\u306e\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u8a00\u8a9e\u3092\u4f7f\u3063\u3066\u672c\u683c\u7684\u306a\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3092\u69cb\u7bc9\u53ef\u80fd\u3067\u3059\u3002<\/p>\n<figure id=\"attachment_143661\" aria-describedby=\"caption-attachment-143661\" style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/01\/programming-language-community-sizes-worldwide-2022.png\" alt=\" 2022\u5e74\u306b\u30d7\u30ed\u30b0\u30e9\u30de\u30fc\u304c\u4f7f\u7528\u3059\u308b\u8a00\u8a9e\u306b\u3064\u3044\u3066\u306eSlash\/Data\u306e\u8abf\u67fb\" width=\"960\" height=\"908\"><figcaption id=\"caption-attachment-143661\" class=\"wp-caption-text\">2022\u5e74\u306b\u30d7\u30ed\u30b0\u30e9\u30de\u30fc\u304c\u4f7f\u7528\u3059\u308b\u8a00\u8a9e\u306b\u3064\u3044\u3066\u306eSlash\/Data\u306e\u8abf\u67fb\uff08\u753b\u50cf\u53c2\u7167\u5143\uff1a<a href=\"https:\/\/www.statista.com\/statistics\/1241923\/worldwide-software-developer-programming-language-communities\/\" target=\"_blank\" rel=\"noopener noreferrer\">Statista<\/a>\uff09<\/figcaption><\/figure>\n<p>React\u306e\u3088\u3046\u306aJavaScript\u30e9\u30a4\u30d6\u30e9\u30ea\u3084Next.js\u306e\u3088\u3046\u306a<a href=\"https:\/\/kinsta.com\/javascript\/#frameworks\">\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af<\/a>\u306e\u767b\u5834\u304c\u3001\u305d\u306e\u958b\u767a\u529b\u3092\u3055\u3089\u306b\u9ad8\u3081\u308b\u3053\u3068\u306b\u306a\u308a\u307e\u3057\u305f\u3002\u3053\u308c\u3089\u306e\u30e9\u30a4\u30d6\u30e9\u30ea\u3084\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306f\u3001\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u3068\u30d0\u30c3\u30af\u30a8\u30f3\u30c9\u306e\u7d71\u5408\u3092\u7c21\u7d20\u5316\u3057\u3066\u304f\u308c\u307e\u3059\u3002\u3055\u3089\u306b\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/what-is-npm\/\">npm<\/a>\uff08Node.js\u306e\u30d1\u30c3\u30b1\u30fc\u30b8\u30de\u30cd\u30fc\u30b8\u30e3\uff09\u306e\u3088\u3046\u306a\u30d1\u30c3\u30b1\u30fc\u30b8\u30de\u30cd\u30fc\u30b8\u30e3\u3092\u4f7f\u3063\u3066JavaScript\u306e\u6a5f\u80fd\u3092\u62e1\u5f35\u3057\u3001JavaScript\u306e\u30e9\u30a4\u30d6\u30e9\u30ea\u3084\u30c4\u30fc\u30eb\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3067\u304d\u307e\u3059\u3002\u5404\u7a2e\u30ea\u30bd\u30fc\u30b9\u306f\u3001\u81ea\u5206\u3067\u66f8\u304b\u306a\u3051\u308c\u3070\u306a\u3089\u306a\u3044\u30b3\u30fc\u30c9\u306e\u91cf\u3092\u6e1b\u3089\u3059\u4e0a\u3067\u6b20\u304b\u305b\u306a\u3044\u5b58\u5728\u3067\u3059\u3002<\/p>\n<p>JavaScript\u306e\u62e1\u5f35\u6027\u306b\u306f\u76ee\u3092\u898b\u5f35\u308b\u3082\u306e\u304c\u3042\u308a\u307e\u3059\u3002\u3053\u308c\u306b\u3064\u3044\u3066\u5305\u62ec\u7684\u306a\u77e5\u8b58\u3092\u7372\u5f97\u3059\u308b\u3053\u3068\u3067\u3001\u30a6\u30a7\u30d6\u958b\u767a\u8005\u3068\u3057\u3066\u306e\u6210\u529f\u306b\u8fd1\u3065\u304f\u3053\u3068\u304c\u3067\u304d\u308b\u306f\u305a\u3067\u3059\u3002<\/p>\n<h2>Next.js\u3068\u306f<\/h2>\n<p>Next.js\u306f2016\u5e74\u306bVercel\u793e\u304b\u3089\u30ea\u30ea\u30fc\u30b9\u3055\u308c\u307e\u3057\u305f\u3002\u9ad8\u6027\u80fd\u306a<a href=\"https:\/\/kinsta.com\/jp\/blog\/web-application-architecture\/\">\u30a6\u30a7\u30d6\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3<\/a>\u306e\u69cb\u7bc9\u3092\u652f\u3048\u308b\u30aa\u30fc\u30d7\u30f3\u30bd\u30fc\u30b9\u306eReact\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u3067\u3059\u3002Twitch\u3001TikTok\u3001Uber\u306a\u3069\u3001\u4e16\u754c\u306e\u6709\u540d\u4f01\u696d\u304c\u63a1\u7528\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>Next.js\u306f\u3001\u9ad8\u901f\u3067SEO\u306b\u5f37\u3044\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u69cb\u7bc9\u306b\u5411\u3044\u3066\u3044\u307e\u3059\u3002Next.js\u304c\u512a\u308c\u305f\u30d7\u30ed\u30c0\u30af\u30b7\u30e7\u30f3\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u3067\u3042\u308b\u3053\u3068\u3092\u793a\u3059\u7279\u5fb4\u3092\u3044\u304f\u3064\u304b\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n<ul>\n<li>\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u6a5f\u80fd<\/li>\n<li>\u81ea\u52d5\u30b3\u30fc\u30c9\u5206\u5272<\/li>\n<li>\u753b\u50cf\u306e\u6700\u9069\u5316<\/li>\n<li>CSS\u30d7\u30ea\u30d7\u30ed\u30bb\u30c3\u30b5\u3068CSS-in-JS\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u30d3\u30eb\u30c8\u30a4\u30f3\u30b5\u30dd\u30fc\u30c8<\/li>\n<li>\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u6a5f\u80fd<\/li>\n<\/ul>\n<p>\u3053\u308c\u3089\u306e\u6a5f\u80fd\u306b\u3088\u308a\u3001Next.js\u3092\u4f7f\u3063\u3066\u3001\u8a2d\u5b9a\u3084\u8abf\u6574\u306b\u304b\u304b\u308b\u6642\u9593\u3092\u5927\u5e45\u306b\u77ed\u7e2e\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u4f8b\u3048\u3070\u3001\u6b21\u306e\u3088\u3046\u306a\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u69cb\u7bc9\u306b\u3001\u3059\u3050\u306b\u53d6\u308a\u304b\u304b\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n<ul>\n<li>EC\/\u30aa\u30f3\u30e9\u30a4\u30f3\u30b9\u30c8\u30a2<\/li>\n<li>\u30d6\u30ed\u30b0<\/li>\n<li>\u30c0\u30c3\u30b7\u30e5\u30dc\u30fc\u30c9<\/li>\n<li>\u30b7\u30f3\u30b0\u30eb\u30da\u30fc\u30b8\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3<\/li>\n<li>\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u306a\u30e6\u30fc\u30b6\u30fc\u30a4\u30f3\u30bf\u30fc\u30d5\u30a7\u30fc\u30b9<\/li>\n<li>\u9759\u7684\u30b5\u30a4\u30c8<\/li>\n<\/ul>\n<h2>React\u3068\u306f<\/h2>\n<p>React\u306f\u3001\u52d5\u7684\u306a\u30e6\u30fc\u30b6\u30fc\u30a4\u30f3\u30bf\u30fc\u30d5\u30a7\u30fc\u30b9\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306aJavaScript\u30e9\u30a4\u30d6\u30e9\u30ea\u3067\u3059\u3002\u30a6\u30a7\u30d6\u30a4\u30f3\u30bf\u30fc\u30d5\u30a7\u30fc\u30b9\u3060\u3051\u3067\u306a\u304f\u3001React Native\u3092\u4f7f\u3063\u3066\u30e2\u30d0\u30a4\u30eb\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3092\u69cb\u7bc9\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n<p>React\u3092\u4f7f\u7528\u3059\u308b\u30e1\u30ea\u30c3\u30c8\u3068\u3057\u3066\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u3082\u306e\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n<ul>\n<li><strong>\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u306e\u5411\u4e0a<\/strong>\uff1aReact\u3067\u306f\u3001DOM\u5185\u306e\u5168\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u6bce\u56de\u7de8\u96c6\u3059\u308b\u4ee3\u308f\u308a\u306b\u3001\u4eee\u60f3DOM\u3092\u4f7f\u7528\u3057\u5909\u66f4\u306e\u5fc5\u8981\u306a\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u307f\u304c\u66f4\u65b0\u3055\u308c\u307e\u3059\u3002<\/li>\n<li><strong>\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u30d9\u30fc\u30b9<\/strong>\uff1a\u4e00\u5ea6\u4f5c\u6210\u3057\u3066\u3057\u307e\u3048\u3070\u3001\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u7e70\u308a\u8fd4\u3057\u5229\u7528\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n<li><strong>\u30c7\u30d0\u30c3\u30b0\u304c\u5bb9\u6613<\/strong>\uff1aReact\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3067\u306f\u3001\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u3001\u4e00\u65b9\u5411\u306e\u30c7\u30fc\u30bf\u30d5\u30ed\u30fc\u304c\u63a1\u7528\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/li>\n<\/ul>\n<h2>Next.js\u3068React\u306e\u6bd4\u8f03<\/h2>\n<p>Next.js\u3068React\u306f\u540c\u3058\u3088\u3046\u306a\u76ee\u7684\u3067\u4f7f\u308f\u308c\u308b\u3053\u3068\u304c\u591a\u3044\u306e\u3067\u3059\u304c\u3001\u4e21\u8005\u306b\u306f\u57fa\u672c\u7684\u306a\u9055\u3044\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n<h3>\u4f7f\u3044\u3084\u3059\u3055<\/h3>\n<p>Next.js\u3082React\u3082\u3001\u6bd4\u8f03\u7684\u7c21\u5358\u306b\u4f7f\u3044\u59cb\u3081\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u305d\u308c\u305e\u308c\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/how-to-install-node-js\/\">Node.js\u306enpm<\/a>\u306e\u4e00\u90e8\u3067\u3042\u308b<code>npx<\/code>\u3092\u4f7f\u3063\u3066\u3001\u30bf\u30fc\u30df\u30ca\u30eb\u30671\u3064\u306e\u30b3\u30de\u30f3\u30c9\u3092\u5b9f\u884c\u3059\u308b\u3060\u3051\u3067OK\u3067\u3059\u3002<\/p>\n<p>Next.js\u306e\u5834\u5408\u3001\u6700\u3082\u30b7\u30f3\u30d7\u30eb\u306a\u30b3\u30de\u30f3\u30c9\u306f\u6b21\u306e\u3068\u304a\u308a\u3067\u3059\u3002<\/p>\n<pre><code>npx create-next-app<\/code><\/pre>\n<p><code>create-next-app<\/code> \u3067\u306f\u3001\u8ffd\u52a0\u306e\u5f15\u6570\u3092\u4f7f\u3046\u3053\u3068\u306a\u304f\u3001\u5bfe\u8a71\u5f62\u5f0f\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3092\u9032\u3081\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u540d\uff08\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u4f7f\u7528\u3055\u308c\u307e\u3059\uff09\u3068\u3001TypeScript\u3068\u30b3\u30fc\u30c9\u30ea\u30f3\u30bf\u30fcESLint\u306e\u30b5\u30dd\u30fc\u30c8\u304c\u5fc5\u8981\u304b\u3069\u3046\u304b\u304c\u5c0b\u306d\u3089\u308c\u307e\u3059\u3002<\/p>\n<p>\u5177\u4f53\u7684\u306b\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n<figure id=\"attachment_144635\" aria-describedby=\"caption-attachment-144635\" style=\"width: 1040px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/01\/using-npx-to-create-next-app.png\" alt=\"\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u30e2\u30fc\u30c9\u3067Next.js\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3092\u4f5c\u6210\u3059\u308b\" width=\"1040\" height=\"467\"><figcaption id=\"caption-attachment-144635\" class=\"wp-caption-text\">\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u30e2\u30fc\u30c9\u3067Next.js\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3092\u4f5c\u6210\u3059\u308b<\/figcaption><\/figure>\n<p>React\u30a4\u30f3\u30b9\u30bf\u30f3\u30b9\u306e\u521d\u671f\u5316\u306b\u3064\u3044\u3066\u8a00\u3048\u3070\u3001\u3082\u3063\u3068\u3082\u30b7\u30f3\u30d7\u30eb\u306a\u30b3\u30de\u30f3\u30c9\u306f\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u540d\u3092\u6307\u5b9a\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<pre><code>npx create-react-app <strong>new-app<\/strong><\/code><\/pre>\n<p>\u3053\u308c\u306b\u3088\u3063\u3066\u3001\u5fc5\u8981\u306a\u521d\u671f\u8a2d\u5b9a\u3068\u4f9d\u5b58\u95a2\u4fc2\u3092\u3059\u3079\u3066\u542b\u3080\u30d5\u30a9\u30eb\u30c0\u304c\u751f\u6210\u3055\u308c\u307e\u3059\u3002<\/p>\n<figure id=\"attachment_144636\" aria-describedby=\"caption-attachment-144636\" style=\"width: 1040px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/01\/using-npx-to-create-react-app.png\" alt=\"\u30bf\u30fc\u30df\u30ca\u30eb\u306e\u30b3\u30de\u30f3\u30c9\u30e9\u30a4\u30f3\u304b\u3089React\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\u3059\u308b\" width=\"1040\" height=\"756\"><figcaption id=\"caption-attachment-144636\" class=\"wp-caption-text\">\u30bf\u30fc\u30df\u30ca\u30eb\u306e\u30b3\u30de\u30f3\u30c9\u30e9\u30a4\u30f3\u304b\u3089React\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\u3059\u308b<\/figcaption><\/figure>\n<p>\u3069\u3061\u3089\u3082\u7c21\u5358\u306b\u59cb\u3081\u3089\u308c\u307e\u3059\u304c\u3001\u5927\u4e8b\u306a\u70b9\u3068\u3057\u3066Next.js\u306fReact\u4e0a\u306b\u69cb\u7bc9\u3055\u308c\u3066\u3044\u307e\u3059\u3002\u3064\u307e\u308a\u3001Next.js\u3092\u4f7f\u3044\u3053\u306a\u3059\u305f\u3081\u306b\u306f\u3001React\u3092\u5b66\u3073\u305d\u306e\u4ed5\u7d44\u307f\u3092\u7406\u89e3\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002\u3068\u306f\u8a00\u3048\u3001React\u306e\u5b66\u7fd2\u306f\u6c7a\u3057\u3066\u96e3\u3057\u304f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n<p>\u307e\u305f\u3001React\u306f\u3042\u308b\u610f\u5473\u3067\u3001\u975e\u69cb\u9020\u7684\u3067\u3042\u308b\u3053\u3068\u306b\u3082\u6ce8\u610f\u304c\u5fc5\u8981\u3067\u3059\u3002React\u306e\u30eb\u30fc\u30bf\u30fc\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u3066\u8a2d\u5b9a\u3057\u3001\u30c7\u30fc\u30bf\u306e\u53d6\u5f97\u3001\u753b\u50cf\u306e\u6700\u9069\u5316\u3001\u30b3\u30fc\u30c9\u306e\u5206\u5272\u3092\u3069\u306e\u3088\u3046\u306b\u51e6\u7406\u3059\u308b\u304b\u3092\u6c7a\u5b9a\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002\u3053\u306e\u30bb\u30c3\u30c8\u30a2\u30c3\u30d7\u306b\u306f\u3001\u8ffd\u52a0\u306e\u30e9\u30a4\u30d6\u30e9\u30ea\u3084\u30c4\u30fc\u30eb\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3068\u8a2d\u5b9a\u304c\u5fc5\u8981\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<p>\u3053\u308c\u306b\u5bfe\u3057\u3066Next.js\u3067\u306f\u3001\u5404\u7a2e\u30c4\u30fc\u30eb\u304c\u3042\u3089\u304b\u3058\u3081\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3055\u308c\u3001\u5fc5\u8981\u306a\u8a2d\u5b9a\u3082\u884c\u308f\u308c\u307e\u3059\u3002Next.js\u3067\u306f\u3001<code>pages<\/code>\u30d5\u30a9\u30eb\u30c0\u306b\u8ffd\u52a0\u3055\u308c\u305f\u30d5\u30a1\u30a4\u30eb\u306f\u3001\u81ea\u52d5\u7684\u306b\u30eb\u30fc\u30c8\u3068\u3057\u3066\u6a5f\u80fd\u3057\u307e\u3059\u3002\u3053\u306e\u6a5f\u80fd\u306b\u3088\u308a\u3001Next.js\u306f\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u30ed\u30b8\u30c3\u30af\u306e\u9762\u3067\u4f7f\u3044\u3084\u3059\u3055\u304c\u3042\u308a\u3001\u3059\u3050\u306b\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u306b\u7740\u624b\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n<h2>Next.js\u3068React\u306e\u7279\u5fb4<\/h2>\n<p>Next.js\u304cReact\u3092\u30d9\u30fc\u30b9\u306b\u3057\u3066\u3044\u308b\u3068\u3044\u3046\u6027\u8cea\u4e0a\u3001\u4e21\u8005\u306f\u5fc5\u7136\u7684\u306b\u3044\u304f\u3064\u304b\u306e\u6a5f\u80fd\u3092\u5171\u6709\u3057\u3066\u3044\u307e\u3059\u3002\u305d\u308c\u3092\u8e0f\u307e\u3048\u305f\u4e0a\u3067\u3001Next.js\u3067\u306f\u3055\u3089\u306b\u4e00\u6b69\u9032\u3093\u3067\u3001\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u3001\u30b3\u30fc\u30c9\u5206\u5272\u3001\u30d7\u30ea\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3001API\u30b5\u30dd\u30fc\u30c8\u306a\u3069\u306e\u6a5f\u80fd\u3092\u3059\u3050\u306b\u5229\u7528\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u3053\u308c\u3089\u306f\u3001React\u3067\u306f\u81ea\u5206\u3067\u8a2d\u5b9a\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n<h3>\u30c7\u30fc\u30bf\u306e\u30d5\u30a7\u30c3\u30c1<\/h3>\n<p>React\u306f\u3001\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u5074\u3067\u30c7\u30fc\u30bf\u3092\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3057\u307e\u3059\u3002\u30b5\u30fc\u30d0\u30fc\u304b\u3089\u30d6\u30e9\u30a6\u30b6\u306b\u9759\u7684\u30d5\u30a1\u30a4\u30eb\u3092\u9001\u4fe1\u3057\u3001\u30d6\u30e9\u30a6\u30b6\u304cAPI\u304b\u3089\u30c7\u30fc\u30bf\u3092\u53d6\u5f97\u3057\u3066\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306b\u53cd\u6620\u3055\u305b\u307e\u3059\u3002\u3053\u306e\u30d7\u30ed\u30bb\u30b9\u306f\u3001\u30a2\u30d7\u30ea\u306e\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u4f4e\u4e0b\u3092\u62db\u304f\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002\u30a2\u30d7\u30ea\u306e\u8aad\u307f\u8fbc\u307f\u304c\u9045\u3044\u3068\u3001\u30e6\u30fc\u30b6\u30fc\u30a8\u30af\u30b9\u30da\u30ea\u30a8\u30f3\u30b9\u306b\u60aa\u5f71\u97ff\u304c\u51fa\u307e\u3059\u3002\u4e00\u65b9\u3067Next.js\u306f\u3001\u30d7\u30ea\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u306b\u3088\u3063\u3066\u3053\u306e\u554f\u984c\u3092\u89e3\u6c7a\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>\u30d7\u30ea\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3067\u306f\u3001\u30d6\u30e9\u30a6\u30b6\u3078\u306e\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u9001\u4fe1\u306e\u524d\u306b\u3001\u30b5\u30fc\u30d0\u30fc\u304c\u5fc5\u8981\u306aAPI\u30b3\u30fc\u30eb\u3092\u884c\u3044\u3001\u30c7\u30fc\u30bf\u3092\u53d6\u308a\u8fbc\u307f\u307e\u3059\u3002\u305d\u306e\u305f\u3081\u3001\u30d6\u30e9\u30a6\u30b6\u306b\u306f\u3059\u3050\u306b\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u53ef\u80fd\u306a\u30a6\u30a7\u30d6\u30da\u30fc\u30b8\u304c\u9001\u308a\u5c4a\u3051\u3089\u308c\u307e\u3059\u3002<\/p>\n<p>\u30d7\u30ea\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u306f\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/react-static-site-generator\/\">\u9759\u7684\u30b5\u30a4\u30c8\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0<\/a>\uff08SSG\uff09\u307e\u305f\u306f\u30b5\u30fc\u30d0\u30fc\u30b5\u30a4\u30c9\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\uff08SSR\uff09\u3092\u6307\u3059\u3053\u3068\u304c\u3042\u308a\u307e\u3059\u3002SSG\u3067\u306f\u3001HTML\u30da\u30fc\u30b8\u306f\u30d3\u30eb\u30c9\u6642\u306b\u751f\u6210\u3055\u308c\u3001\u8907\u6570\u306e\u30ea\u30af\u30a8\u30b9\u30c8\u306b\u7e70\u308a\u8fd4\u3057\u5229\u7528\u3055\u308c\u307e\u3059\u3002Next.js\u3067\u306f\u3001\u30c7\u30fc\u30bf\u306e\u3042\u308b<a href=\"https:\/\/kinsta.com\/jp\/blog\/what-is-html\/\">HTML<\/a>\u30da\u30fc\u30b8\u3082\u3001\u30c7\u30fc\u30bf\u306e\u306a\u3044HTML\u30da\u30fc\u30b8\u3082\u751f\u6210\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n<p>\u4ee5\u4e0b\u306f\u3001Next.js\u304c\u30c7\u30fc\u30bf\u306a\u3057\u306e\u30da\u30fc\u30b8\u3092\u751f\u6210\u3059\u308b\u4f8b\u3067\u3059\u3002<\/p>\n<pre><code class=\"language-js\">function App() {\n  return &lt;div&gt;Welcome&lt;\/div&gt;\n}\nexport default App<\/code><\/pre>\n<p>\u5916\u90e8\u30c7\u30fc\u30bf\u3092\u5229\u7528\u3059\u308b\u9759\u7684\u30da\u30fc\u30b8\u306b\u306f\u3001<code>getStaticProps()<\/code>\u95a2\u6570\u3092\u5229\u7528\u3057\u307e\u3059\u3002\u30da\u30fc\u30b8\u304b\u3089<code>getStaticProps()<\/code>\u3092\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u3059\u308b\u3068\u3001Next.js\u306f\u305d\u308c\u304c\u8fd4\u3059props\u3092\u5229\u7528\u3057\u3066\u3001\u30da\u30fc\u30b8\u3092\u30d7\u30ea\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3057\u307e\u3059\u3002\u3053\u306e\u95a2\u6570\u306f\u5e38\u306b\u30b5\u30fc\u30d0\u30fc\u4e0a\u3067\u52d5\u4f5c\u3057\u307e\u3059\u3002\u305d\u306e\u305f\u3081\u3001\u30d3\u30eb\u30c9\u6642\u306b\u30da\u30fc\u30b8\u304c\u4f7f\u7528\u3059\u308b\u30c7\u30fc\u30bf\u304c\u5229\u7528\u53ef\u80fd\u306a\u5834\u5408\u306b<code>getStaticProps()<\/code>\u304c\u4f7f\u7528\u3055\u308c\u307e\u3059\u3002\u305f\u3068\u3048\u3070\u3001CMS\u304b\u3089\u30d6\u30ed\u30b0\u8a18\u4e8b\u3092\u53d6\u5f97\u3059\u308b\u5834\u5408\u306a\u3069\u306b\u5229\u7528\u3067\u304d\u307e\u3059\u3002<\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">Posts<\/span><span class=\"token operator\">=<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\"><span class=\"token punctuation\">{<\/span> posts <span class=\"token punctuation\">}<\/span><\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span>\n    <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">(<\/span>\n        <span class=\"token operator\">&lt;<\/span>div className<span class=\"token operator\">=<\/span><span class=\"token punctuation\">{<\/span>styles<span class=\"token punctuation\">.<\/span>container<span class=\"token punctuation\">}<\/span><span class=\"token operator\">&gt;<\/span>\n            <span class=\"token punctuation\">{<\/span>posts<span class=\"token punctuation\">.<\/span><span class=\"token function\">map<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span><span class=\"token parameter\">post<span class=\"token punctuation\">,<\/span> index<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">(<\/span>\n                <span class=\"token comment\">\/\/ render each post<\/span>\n            <span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">}<\/span>\n        <span class=\"token operator\">&lt;<\/span><span class=\"token operator\">\/<\/span>div<span class=\"token operator\">&gt;<\/span>\n    <span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span>\n  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span>\n\n<span class=\"token keyword\">export<\/span> <span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">getStaticProps<\/span> <span class=\"token operator\">=<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span>\n    <span class=\"token keyword\">const<\/span> posts <span class=\"token operator\">=<\/span> <span class=\"token function\">getAllPosts<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span>\n    <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">{<\/span>\n        <span class=\"token literal-property property\">props<\/span><span class=\"token operator\">:<\/span> <span class=\"token punctuation\">{<\/span> posts <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">,<\/span>\n    <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span>\n<span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p>\u30da\u30fc\u30b8\u30d1\u30b9\u304c\u5916\u90e8\u30c7\u30fc\u30bf\u306b\u4f9d\u5b58\u3057\u3066\u3044\u308b\u72b6\u6cc1\u3067\u306f\u3001<code>getStaticPaths()<\/code>\u95a2\u6570\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002\u3064\u307e\u308a\u3001\u6295\u7a3fID\u306b\u57fa\u3065\u3044\u305f\u30d1\u30b9\u3092\u4f5c\u6210\u3059\u308b\u306b\u306f\u3001<code>getStaticPaths()<\/code>\u3092\u30da\u30fc\u30b8\u304b\u3089\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u3059\u308b\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<p>\u4f8b\u3048\u3070\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u300c<strong>pages\/posts\/[id].js<\/strong>\u300d\u304b\u3089<code>getStaticPaths()<\/code>\u3092\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u3057\u307e\u3059\u3002<\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">export<\/span> <span class=\"token function-variable function\">getStaticPaths<\/span> <span class=\"token operator\">=<\/span> <span class=\"token keyword\">async<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span>  <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span>\n  <span class=\"token comment\">\/\/ Get all the posts<\/span>\n  <span class=\"token keyword\">const<\/span> posts <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> <span class=\"token function\">getAllPosts<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span>\n\n  <span class=\"token comment\">\/\/ Get the paths you want to pre-render based on posts<\/span>\n  <span class=\"token keyword\">const<\/span> paths <span class=\"token operator\">=<\/span> posts<span class=\"token punctuation\">.<\/span><span class=\"token function\">map<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span><span class=\"token parameter\">post<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span>\n    <span class=\"token literal-property property\">params<\/span><span class=\"token operator\">:<\/span> <span class=\"token punctuation\">{<\/span> <span class=\"token literal-property property\">id<\/span><span class=\"token operator\">:<\/span> post<span class=\"token punctuation\">.<\/span>id <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">,<\/span>\n  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span>\n  <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">{<\/span> paths<span class=\"token punctuation\">,<\/span> <span class=\"token literal-property property\">fallback<\/span><span class=\"token operator\">:<\/span> <span class=\"token boolean\">false<\/span> <span class=\"token punctuation\">}<\/span>\n<span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><code>getStaticPaths()<\/code>\u306f\u591a\u304f\u306e\u5834\u5408\u3001<code>getStaticProps()<\/code>\u3068\u5bfe\u306b\u306a\u308a\u307e\u3059\u3002\u3053\u306e\u4f8b\u3067\u306f\u3001<code>getStaticProps()<\/code>\u3092\u4f7f\u3063\u3066\u3001\u30d1\u30b9\u306e\u4e2d\u306eID\u306e\u8a73\u7d30\u60c5\u5831\u3092\u53d6\u5f97\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">export<\/span> <span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">getStaticProps<\/span> <span class=\"token operator\">=<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\"><span class=\"token punctuation\">{<\/span> params <span class=\"token punctuation\">}<\/span><\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span>\n    <span class=\"token keyword\">const<\/span> post <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> <span class=\"token function\">getSinglePost<\/span><span class=\"token punctuation\">(<\/span>params<span class=\"token punctuation\">.<\/span>id<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span>\n    <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">{<\/span>\n        <span class=\"token literal-property property\">props<\/span><span class=\"token operator\">:<\/span> <span class=\"token punctuation\">{<\/span> post <span class=\"token punctuation\">}<\/span>\n    <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span>\n<span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p>SSR\u3067\u306f\u3001\u30c7\u30fc\u30bf\u304c\u8981\u6c42\u3055\u308c\u305f\u6642\u70b9\u3067\u53d6\u5f97\u3055\u308c\u3001\u30d6\u30e9\u30a6\u30b6\u306b\u9001\u4fe1\u3055\u308c\u307e\u3059\u3002SSR\u3092\u4f7f\u7528\u3059\u308b\u306b\u306f\u3001\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3057\u305f\u3044\u30da\u30fc\u30b8\u304b\u3089<code>getServerSide()<\/code> props\u95a2\u6570\u3092\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u3057\u307e\u3059\u3002\u30b5\u30fc\u30d0\u30fc\u306f\u30ea\u30af\u30a8\u30b9\u30c8\u3054\u3068\u306b\u3053\u306e\u95a2\u6570\u3092\u547c\u3073\u51fa\u3059\u306e\u3067\u3001SSR\u306f\u52d5\u7684\u306a\u30c7\u30fc\u30bf\u3092\u7528\u3044\u305f\u30da\u30fc\u30b8\u3067\u6709\u52b9\u3067\u3059\u3002<\/p>\n<p>\u4f8b\u3048\u3070\u3001\u30cb\u30e5\u30fc\u30b9API\u304b\u3089\u30c7\u30fc\u30bf\u3092\u53d6\u5f97\u3059\u308b\u306e\u306b\u4f7f\u3046\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">News<\/span> <span class=\"token operator\">=<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\"><span class=\"token punctuation\">{<\/span> data <span class=\"token punctuation\">}<\/span><\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span>\n    <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">(<\/span>\n        <span class=\"token comment\">\/\/ render data<\/span>\n    <span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span>\n  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span>\n\n<span class=\"token keyword\">export<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token keyword\">function<\/span> <span class=\"token function\">getServerSideProps<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span>\n    <span class=\"token keyword\">const<\/span> res <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> <span class=\"token function\">fetch<\/span><span class=\"token punctuation\">(<\/span><span class=\"token template-string\"><span class=\"token template-punctuation string\">`<\/span><span class=\"token string\">https:\/\/app-url\/data<\/span><span class=\"token template-punctuation string\">`<\/span><\/span><span class=\"token punctuation\">)<\/span>\n    <span class=\"token keyword\">const<\/span> data <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> res<span class=\"token punctuation\">.<\/span><span class=\"token function\">json<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span>\n    <span class=\"token keyword\">return<\/span> <span class=\"token punctuation\">{<\/span> <span class=\"token literal-property property\">props<\/span><span class=\"token operator\">:<\/span> <span class=\"token punctuation\">{<\/span> data <span class=\"token punctuation\">}<\/span> <span class=\"token punctuation\">}<\/span>\n<span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p>\u30c7\u30fc\u30bf\u304c\u30ea\u30af\u30a8\u30b9\u30c8\u3054\u3068\u306b\u53d6\u5f97\u3055\u308c\u3001props\u3092\u4ecb\u3057News\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306b\u6e21\u3055\u308c\u307e\u3059\u3002<\/p>\n<h3>\u30b3\u30fc\u30c9\u306e\u5206\u5272<\/h3>\n<p>\u30b3\u30fc\u30c9\u5206\u5272\u306f\u3001\u30b3\u30fc\u30c9\u3092\u5c0f\u5206\u3051\u306b\u3059\u308b\u3053\u3068\u3092\u610f\u5473\u3057\u307e\u3059\u3002\u3053\u308c\u306b\u3088\u308a\u3001\u30d6\u30e9\u30a6\u30b6\u3067\u5fc5\u8981\u306b\u5fdc\u3058\u3066\u30ed\u30fc\u30c9\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002\u30b5\u30fc\u30d0\u30fc\u304b\u3089\u306f\u3001\u30e6\u30fc\u30b6\u30fc\u304c\u5fc5\u8981\u3068\u3059\u308b\u3082\u306e\u3060\u3051\u304c\u9001\u4fe1\u3055\u308c\u308b\u305f\u3081\u3001\u6700\u521d\u306e\u8aad\u307f\u8fbc\u307f\u6642\u306b\u30d6\u30e9\u30a6\u30b6\u306b\u9001\u4fe1\u3055\u308c\u308b\u30b3\u30fc\u30c9\u306e\u91cf\u3092\u6e1b\u3089\u3059\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002Webpack\u3001Rollup\u3001Browserify\u306a\u3069\u306e\u30d0\u30f3\u30c9\u30eb\u3067\u3001React\u306e\u30b3\u30fc\u30c9\u5206\u5272\u304c\u30b5\u30dd\u30fc\u30c8\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>Next.js\u306f\u3001\u30b3\u30fc\u30c9\u5206\u5272\u306b\u30c7\u30d5\u30a9\u30eb\u30c8\u3067\u5bfe\u5fdc\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>Next.js\u3067\u306f\u3001\u5404\u30da\u30fc\u30b8\u306e\u30b3\u30fc\u30c9\u304c\u5206\u5272\u3055\u308c\u3001\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306b\u30da\u30fc\u30b8\u3092\u8ffd\u52a0\u3057\u3066\u3082\u30d0\u30f3\u30c9\u30eb\u30b5\u30a4\u30ba\u304c\u5927\u304d\u304f\u306a\u308b\u3053\u3068\u306f\u3042\u308a\u307e\u305b\u3093\u3002\u307e\u305f\u3001JavaScript\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u30a4\u30f3\u30dd\u30fc\u30c8\u3057\u3066\u3001\u5b9f\u884c\u6642\u306b\u52d5\u7684\u306b\u8aad\u307f\u8fbc\u3080\u3053\u3068\u304c\u3067\u304d\u308b\u52d5\u7684\u30a4\u30f3\u30dd\u30fc\u30c8\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u307e\u3059\u3002\u52d5\u7684\u30a4\u30f3\u30dd\u30fc\u30c8\u306f\u3001\u30d0\u30f3\u30c9\u30eb\u306e\u9045\u5ef6\u8aad\u307f\u8fbc\u307f\u306b\u3064\u306a\u304c\u308b\u305f\u3081\u30da\u30fc\u30b8\u306e\u9ad8\u901f\u5316\u306b\u8ca2\u732e\u3057\u307e\u3059\u3002<\/p>\n<p>\u305f\u3068\u3048\u3070\u3001\u4e0b\u306e<strong>Home<\/strong>\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3067\u306f\u3001Hero\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u6700\u521d\u306e\u30d0\u30f3\u30c9\u30eb\u306b\u542b\u3081\u306a\u3044\u3088\u3046\u306b\u3057\u3066\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<pre><code class=\"language-js\">const DynamicHero = dynamic(() =&gt; import('..\/components\/Hero'), {\n  suspense: true,\n})\n\nexport default function Home() {\n  return (\n    &lt;Suspense fallback={`Loading...`}&gt;\n      &lt;DynamicHero \/&gt;\n    &lt;\/Suspense&gt;\n  )\n}<\/code><\/pre>\n<p>\u4e0a\u306b\u3042\u308b\u3088\u3046\u306b\u3001Suspense\u306e\u30d5\u30a9\u30fc\u30eb\u30d0\u30c3\u30af\u8981\u7d20\u304c\u3001Hero\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u8aad\u307f\u8fbc\u307f\u306e\u524d\u306b\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3055\u308c\u307e\u3059\u3002<\/p>\n<h3>Next.js\u3068React\u306eAPI\u30b5\u30dd\u30fc\u30c8\u306e\u6bd4\u8f03<\/h3>\n<p>Next.js\u3067\u306f\u3001API\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u6a5f\u80fd\u306b\u3088\u308a\u3001\u30d0\u30c3\u30af\u30a8\u30f3\u30c9\u3068\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u306e\u30b3\u30fc\u30c9\u3092\u540c\u3058\u30b3\u30fc\u30c9\u30d9\u30fc\u30b9\u3067\u8a18\u8ff0\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<strong>pages\/api\/<\/strong>\u30d5\u30a9\u30eb\u30c0\u306b\u4fdd\u5b58\u3055\u308c\u305f\u30da\u30fc\u30b8\u306f\u3059\u3079\u3066<strong>\/api\/*<\/strong>\u30eb\u30fc\u30c8\u306b\u30de\u30c3\u30d7\u3055\u308c\u3001Next.js\u306f\u3053\u308c\u3092<a href=\"https:\/\/kinsta.com\/jp\/blog\/api-endpoint\/\">API\u30a8\u30f3\u30c9\u30dd\u30a4\u30f3\u30c8<\/a>\u3068\u3057\u3066\u6271\u3044\u307e\u3059\u3002<\/p>\n<p>\u305f\u3068\u3048\u3070\u3001<strong>pages\/api\/user.js<\/strong>\u3068\u3044\u3046API\u30eb\u30fc\u30c8\u3092\u4f5c\u6210\u3059\u308b\u3068\u3001\u3053\u306e\u3088\u3046\u306b\u73fe\u5728\u306e\u30e6\u30fc\u30b6\u30fc\u540d\u304c\u8fd4\u3055\u308c\u307e\u3059\u3002<\/p>\n<pre><code class=\"language-js\">export default function user(req, res) {\n    res.status(200).json({ username: 'Jane' });\n}<\/code><\/pre>\n<p><strong>https:\/\/app-url\/api\/user<\/strong>\u306eURL\u306b\u30a2\u30af\u30bb\u30b9\u3059\u308b\u3068\u3001username\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n<pre><code class=\"language-json\">{\n        username: 'Jane'\n}<\/code><\/pre>\n<p>API\u30eb\u30fc\u30c8\u306f\u3001\u30a2\u30af\u30bb\u30b9\u3057\u3066\u3044\u308b\u30b5\u30fc\u30d3\u30b9\u306eURL\u3092\u96a0\u3057\u305f\u3044\u5834\u5408\u3084\u3001\u30d0\u30c3\u30af\u30a8\u30f3\u30c9\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u5168\u4f53\u3092\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u305b\u305a\u306b\u74b0\u5883\u5909\u6570\u3092\u79d8\u5bc6\u306b\u3057\u3066\u304a\u304d\u305f\u3044\u5834\u5408\u306b\u4fbf\u5229\u3067\u3059\u3002<\/p>\n<h3>\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9<\/h3>\n<p>Next.js\u306f\u3001\u30b7\u30f3\u30d7\u30eb\u306a\u30d7\u30ed\u30bb\u30b9\u3067\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u306e\u9ad8\u3044\u30a2\u30d7\u30ea\u3092\u4f5c\u6210\u3067\u304d\u308b\u70b9\u3067\u512a\u308c\u3066\u3044\u308b\u3053\u3068\u306f\u9593\u9055\u3044\u3042\u308a\u307e\u305b\u3093\u3002SSR\u304a\u3088\u3073SSG\u306eNext.js\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306f\u3001\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30b5\u30a4\u30c9\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\uff08CSR\uff09\u306eReact\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3088\u308a\u3082\u4e00\u822c\u7684\u306b\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u304c\u512a\u308c\u3066\u3044\u307e\u3059\u3002Next.js\u3067\u306f\u3001\u30b5\u30fc\u30d0\u30fc\u3067\u30c7\u30fc\u30bf\u3092\u53d6\u5f97\u3057\u3001\u30d6\u30e9\u30a6\u30b6\u304c\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u306b\u5fc5\u8981\u3068\u3059\u308b\u3059\u3079\u3066\u306e\u3082\u306e\u3092\u9001\u4fe1\u3059\u308b\u3053\u3068\u3067\u3001API\u3092\u7528\u3044\u305f\u30c7\u30fc\u30bf\u30d5\u30a7\u30c3\u30c1\u306e\u8981\u6c42\u304c\u4e0d\u8981\u306b\u306a\u308a\u307e\u3059\u3002\u3053\u308c\u306f\u3001\u8aad\u307f\u8fbc\u307f\u6642\u9593\u306e\u77ed\u7e2e\u3092\u610f\u5473\u3057\u307e\u3059\u3002<\/p>\n<p>\u3055\u3089\u306b\u3001Next.js\u306f\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30b5\u30a4\u30c9\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u307e\u3059\u3002\u30e6\u30fc\u30b6\u30fc\u304c\u5225\u306e\u30eb\u30fc\u30c8\u306b\u79fb\u52d5\u3057\u3066\u3082\u3001\u90fd\u5ea6\u30d6\u30e9\u30a6\u30b6\u306b\u3088\u308b\u30b5\u30fc\u30d0\u30fc\u304b\u3089\u306e\u30c7\u30fc\u30bf\u306e\u30d5\u30a7\u30c3\u30c1\u3092\u5fc5\u8981\u3068\u3057\u307e\u305b\u3093\u3002\u3055\u3089\u306b\u3001Next.js\u306e\u753b\u50cf\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306f\u3001\u753b\u50cf\u306e\u81ea\u52d5\u6700\u9069\u5316\u3092\u53ef\u80fd\u306b\u3057\u307e\u3059\u3002\u753b\u50cf\u306f\u3001\u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\u306b\u5165\u3063\u305f\u3068\u304d\u306b\u3060\u3051\u8aad\u307f\u8fbc\u307e\u308c\u308b\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002\u307e\u305f\u3001Next.js\u3067\u306f\u53ef\u80fd\u306a\u9650\u308a\u3001<a href=\"https:\/\/kinsta.com\/jp\/blog\/webp\/#what-is-webp\">WebP<\/a>\u306e\u3088\u3046\u306a\u6700\u65b0\u306e\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u3067\u753b\u50cf\u304c\u914d\u4fe1\u3055\u308c\u307e\u3059\u3002<\/p>\n<p>Next.js\u306f\u3001\u30d5\u30a9\u30f3\u30c8\u306e\u6700\u9069\u5316\u3001\u30b9\u30de\u30fc\u30c8\u30eb\u30fc\u30c8\u30d7\u30ea\u30d5\u30a7\u30c3\u30c1\u3001\u30d0\u30f3\u30c9\u30ea\u30f3\u30b0\u306e\u6700\u9069\u5316\u306b\u3082\u5bfe\u5fdc\u3057\u3066\u3044\u307e\u3059\u3002\u3053\u308c\u3089\u306e\u6700\u9069\u5316\u306f\u3001React\u3067\u306f\u81ea\u52d5\u3067\u9069\u7528\u3055\u308c\u307e\u305b\u3093\u3002<\/p>\n<h3>\u30b5\u30dd\u30fc\u30c8<\/h3>\n<p>React\u306fNext.js\u3088\u308a\u3082\u6b74\u53f2\u304c\u9577\u3044\u305f\u3081\u3001\u30b3\u30df\u30e5\u30cb\u30c6\u30a3\u306e\u5927\u304d\u3055\u3067\u52dd\u308a\u307e\u3059\u3002\u3057\u304b\u3057\u3001\u591a\u304f\u306eReact\u958b\u767a\u8005\u304cNext.js\u3092\u63a1\u7528\u3057\u3066\u3044\u308b\u305f\u3081\u3001\u305d\u306e\u30b3\u30df\u30e5\u30cb\u30c6\u30a3\u306f\u7740\u5b9f\u306b\u6210\u9577\u3057\u3066\u3044\u307e\u3059\u3002\u554f\u984c\u304c\u767a\u751f\u3057\u305f\u3068\u304d\u306b\u306f\u3001\u30bc\u30ed\u304b\u3089\u89e3\u6c7a\u7b56\u3092\u8003\u3048\u308b\u3088\u308a\u3082\u3001\u65e2\u5b58\u306e\u4e8b\u4f8b\u3092\u898b\u3064\u3051\u3066\u5229\u7528\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n<p>\u307e\u305f\u3001Next.js\u306f\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u304c\u5145\u5b9f\u3057\u3066\u304a\u308a\u3001\u5206\u304b\u308a\u3084\u3059\u3044\u30b5\u30f3\u30d7\u30eb\u304c\u63c3\u3063\u3066\u3044\u308b\u3053\u3068\u3082\u7279\u5fb4\u3067\u3059\u3002\u4e00\u65b9\u3067\u3001React\u306e\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u306f\u3001\u305d\u306e\u4eba\u6c17\u306b\u3082\u304b\u304b\u308f\u3089\u305a\u3001\u305d\u3053\u307e\u3067\u898b\u3084\u3059\u3044\u3082\u306e\u3068\u306f\u8a00\u3048\u306a\u3044\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<\/p>\n\n<h2>\u307e\u3068\u3081<\/h2>\n<p>Next.js\u3068React\u306e\u3069\u3061\u3089\u3092\u9078\u629e\u3059\u308b\u304b\u306f\u3001\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u8981\u4ef6\u6b21\u7b2c\u3067\u3059\u3002<\/p>\n<p>Next.js\u306f\u3001\u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u3092\u5411\u4e0a\u3055\u305b\u308b\u69cb\u9020\u3068\u30c4\u30fc\u30eb\u3067\u3001React\u306e\u6a5f\u80fd\u306e\u5f37\u5316\u306b\u6210\u529f\u3057\u3066\u3044\u307e\u3059\u3002\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u3001\u30b3\u30fc\u30c9\u5206\u5272\u3001\u753b\u50cf\u6700\u9069\u5316\u306a\u3069\u306e\u6a5f\u80fd\u304cNext.js\u306b\u7d44\u307f\u8fbc\u307e\u308c\u3066\u304a\u308a\u3001\u958b\u767a\u306e\u969b\u306b\u624b\u52d5\u3067\u8a2d\u5b9a\u3059\u308b\u5fc5\u8981\u306f\u3042\u308a\u307e\u305b\u3093\u3002\u3053\u308c\u3089\u306e\u6a5f\u80fd\u306b\u3088\u308a\u3001Next.js\u306f\u4f7f\u3044\u3084\u3059\u3044\u9078\u629e\u80a2\u3067\u3042\u308a\u3001\u3059\u3050\u306b\u305d\u306e\u5f8c\u306e\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u306b\u7740\u624b\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n<p>Next.js\u306f\u3001\u3055\u307e\u3056\u307e\u306a\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u30aa\u30d7\u30b7\u30e7\u30f3\u3092\u5099\u3048\u3066\u3044\u308b\u305f\u3081\u3001\u30b5\u30fc\u30d0\u30fc\u30b5\u30a4\u30c9\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3084\u3001\u9759\u7684\u751f\u6210\u3068Node.js\u30b5\u30fc\u30d0\u30fc\u30b5\u30a4\u30c9\u30ec\u30f3\u30c0\u30ea\u30f3\u30b0\u3092\u7d44\u307f\u5408\u308f\u305b\u305f\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306b\u9069\u3057\u3066\u3044\u307e\u3059\u3002\u307e\u305f\u3001\u6700\u9069\u5316\u6a5f\u80fd\u306b\u3088\u308a\u3001Next.js\u306fEC\u306e\u3088\u3046\u306a\u9ad8\u901f\u6027\u304c\u8981\u6c42\u3055\u308c\u308b\u30b5\u30a4\u30c8\u306b\u3082\u5411\u3044\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>React\u306f\u3001\u5805\u7262\u306a\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u4f5c\u6210\u3068\u62e1\u5f35\u3092\u652f\u63f4\u3059\u308bJavaScript\u30e9\u30a4\u30d6\u30e9\u30ea\u3067\u3059\u3002\u307e\u305f\u3001\u305d\u306e\u69cb\u6587\u306f\u308f\u304b\u308a\u3084\u3059\u304f\u3001\u7279\u306bJavaScript\u306e\u30d0\u30c3\u30af\u30b0\u30e9\u30a6\u30f3\u30c9\u3092\u6301\u3064\u958b\u767a\u8005\u306b\u3068\u3063\u3066\u306f\u6709\u7528\u3067\u3059\u3002\u3055\u3089\u306b\u3001\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3067\u4f7f\u7528\u3059\u308b\u30c4\u30fc\u30eb\u3084\u305d\u306e\u8a2d\u5b9a\u65b9\u6cd5\u3092\u4e8b\u7d30\u304b\u306b\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n<p>\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306e\u958b\u767a\u3092\u8a08\u753b\u4e2d\u3067\u3042\u308c\u3070\u3001React\u3068Next.js\u306e\u3044\u305a\u308c\u3092\u4f7f\u3046\u5834\u5408\u3067\u3042\u3063\u3066\u3082\u3001Kinsta\u306e<a href=\"https:\/\/docs.sevalla.com\/templates\/overview\">Node.js\u30a6\u30a7\u30d6\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u30b5\u30fc\u30d0\u30fc<\/a>\u3092\u3054\u78ba\u8a8d\u304f\u3060\u3055\u3044\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u73fe\u4ee3\u306e\u30a6\u30a7\u30d6\u958b\u767a\u30b7\u30fc\u30f3\u306f\u3001JavaScript\u306e\u30e9\u30a4 &#8230;<\/p>\n","protected":false},"author":117,"featured_media":42207,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[777,802],"class_list":["post-42206","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-javascript-frameworks","topic-react"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\uff5cKinsta\u00ae<\/title>\n<meta name=\"description\" content=\"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\" \/>\n<meta property=\"og:locale\" content=\"ja_JP\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\" \/>\n<meta property=\"og:description\" content=\"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Kinsta-Japan-334616080691171\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-02-13T09:02:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-08-25T15:19:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Salman Ravoof\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\" \/>\n<meta name=\"twitter:creator\" content=\"@salmanravoof\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_JP\" \/>\n<meta name=\"twitter:label1\" content=\"\u57f7\u7b46\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"Salman Ravoof\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u63a8\u5b9a\u8aad\u307f\u53d6\u308a\u6642\u9593\" \/>\n\t<meta name=\"twitter:data2\" content=\"3\u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\"},\"author\":{\"name\":\"Salman Ravoof\",\"@id\":\"https:\/\/kinsta.com\/jp\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987\"},\"headline\":\"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\",\"datePublished\":\"2023-02-13T09:02:21+00:00\",\"dateModified\":\"2023-08-25T15:19:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\"},\"wordCount\":294,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/jp\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\",\"inLanguage\":\"ja\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\",\"url\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\",\"name\":\"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\uff5cKinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/jp\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\",\"datePublished\":\"2023-02-13T09:02:21+00:00\",\"dateModified\":\"2023-08-25T15:19:39+00:00\",\"description\":\"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#breadcrumb\"},\"inLanguage\":\"ja\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ja\",\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\",\"contentUrl\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png\",\"width\":1460,\"height\":730,\"caption\":\"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/jp\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\",\"item\":\"https:\/\/kinsta.com\/jp\/topics\/javascript-frameworks\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/jp\/#website\",\"url\":\"https:\/\/kinsta.com\/jp\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"\u9ad8\u901f\u304b\u3064\u5805\u7262\u306a\u30d7\u30ec\u30df\u30a2\u30e0\u30b5\u30fc\u30d0\u30fc\u30b5\u30fc\u30d3\u30b9\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/jp\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/jp\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ja\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/jp\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/jp\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ja\",\"@id\":\"https:\/\/kinsta.com\/jp\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/jp\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Kinsta-Japan-334616080691171\/\",\"https:\/\/x.com\/Kinsta_JP\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/jp\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987\",\"name\":\"Salman Ravoof\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ja\",\"@id\":\"https:\/\/kinsta.com\/jp\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g\",\"caption\":\"Salman Ravoof\"},\"description\":\"Salman Ravoof is a self-taught web developer, writer, creator, and a huge admirer of Free and Open Source Software (FOSS). Besides tech, he's excited by science, philosophy, photography, arts, cats, and food. Learn more about him on his website, and connect with Salman on Twitter.\",\"sameAs\":[\"https:\/\/salmanravoof.com\",\"https:\/\/www.linkedin.com\/in\/salman-ravoof-5a749133\/\",\"https:\/\/x.com\/salmanravoof\"],\"url\":\"https:\/\/kinsta.com\/jp\/blog\/author\/salmanravoof\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\uff5cKinsta\u00ae","description":"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/","og_locale":"ja_JP","og_type":"article","og_title":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09","og_description":"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002","og_url":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/Kinsta-Japan-334616080691171\/","article_published_time":"2023-02-13T09:02:21+00:00","article_modified_time":"2023-08-25T15:19:39+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","type":"image\/png"}],"author":"Salman Ravoof","twitter_card":"summary_large_image","twitter_description":"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002","twitter_image":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","twitter_creator":"@salmanravoof","twitter_site":"@Kinsta_JP","twitter_misc":{"\u57f7\u7b46\u8005":"Salman Ravoof","\u63a8\u5b9a\u8aad\u307f\u53d6\u308a\u6642\u9593":"3\u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/"},"author":{"name":"Salman Ravoof","@id":"https:\/\/kinsta.com\/jp\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987"},"headline":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09","datePublished":"2023-02-13T09:02:21+00:00","dateModified":"2023-08-25T15:19:39+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/"},"wordCount":294,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/jp\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","inLanguage":"ja","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/","url":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/","name":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09\uff5cKinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/jp\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","datePublished":"2023-02-13T09:02:21+00:00","dateModified":"2023-08-25T15:19:39+00:00","description":"Next.js\u3068React\u304cJavaScript\u3092\u53d6\u308a\u5dfb\u304f\u4e16\u754c\u3067\u3069\u306e\u3088\u3046\u306a\u4f4d\u7f6e\u3065\u3051\u306b\u3042\u308b\u306e\u304b\u3002\u9ad8\u6027\u80fd\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u69cb\u7bc9\u306b\u4fbf\u5229\u306a\u4e21\u8005\u306b\u3064\u3044\u3066\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002","breadcrumb":{"@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#breadcrumb"},"inLanguage":"ja","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/"]}]},{"@type":"ImageObject","inLanguage":"ja","@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#primaryimage","url":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","contentUrl":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/02\/next-js-vs-react.png","width":1460,"height":730,"caption":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/jp\/blog\/nextjs-vs-react\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/jp\/"},{"@type":"ListItem","position":2,"name":"JavaScript\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af","item":"https:\/\/kinsta.com\/jp\/topics\/javascript-frameworks\/"},{"@type":"ListItem","position":3,"name":"Next.js\u3068React\u306e\u9055\u3044\uff08\u4e21\u8005\u306e\u5171\u751f\u306b\u3064\u3044\u3066\u89e3\u8aac\uff09"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/jp\/#website","url":"https:\/\/kinsta.com\/jp\/","name":"Kinsta\u00ae","description":"\u9ad8\u901f\u304b\u3064\u5805\u7262\u306a\u30d7\u30ec\u30df\u30a2\u30e0\u30b5\u30fc\u30d0\u30fc\u30b5\u30fc\u30d3\u30b9","publisher":{"@id":"https:\/\/kinsta.com\/jp\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/jp\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ja"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/jp\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/jp\/","logo":{"@type":"ImageObject","inLanguage":"ja","@id":"https:\/\/kinsta.com\/jp\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/jp\/wp-content\/uploads\/sites\/6\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/jp\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Kinsta-Japan-334616080691171\/","https:\/\/x.com\/Kinsta_JP","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/jp\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987","name":"Salman Ravoof","image":{"@type":"ImageObject","inLanguage":"ja","@id":"https:\/\/kinsta.com\/jp\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g","caption":"Salman Ravoof"},"description":"Salman Ravoof is a self-taught web developer, writer, creator, and a huge admirer of Free and Open Source Software (FOSS). Besides tech, he's excited by science, philosophy, photography, arts, cats, and food. Learn more about him on his website, and connect with Salman on Twitter.","sameAs":["https:\/\/salmanravoof.com","https:\/\/www.linkedin.com\/in\/salman-ravoof-5a749133\/","https:\/\/x.com\/salmanravoof"],"url":"https:\/\/kinsta.com\/jp\/blog\/author\/salmanravoof\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/posts\/42206","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/users\/117"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/comments?post=42206"}],"version-history":[{"count":15,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/posts\/42206\/revisions"}],"predecessor-version":[{"id":49056,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/posts\/42206\/revisions\/49056"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/nl"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/es"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/se"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/translations\/dk"},{"href":"https:\/\/kinsta.com\/jp\/wp-json\/kinsta\/v1\/posts\/42206\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/media\/42207"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/media?parent=42206"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/tags?post=42206"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/jp\/wp-json\/wp\/v2\/topic?post=42206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}