{"componentChunkName":"component---src-modules-datocms-post-page-page-tsx","path":"/posts/35","result":{"data":{"post":{"title":"【連載】 GitHubをもっと便利に! 厳選Chrome拡張!! その1「Octotree」","author":{"name":"reoring","images":{"r32":{"src":"https://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&fm=png&h=32&mask=ellipse&w=32","srcSet":"https://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=1&fm=png&h=32&mask=ellipse&w=32 1x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=1.5&fm=png&h=32&mask=ellipse&w=32 1.5x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=2&fm=png&h=32&mask=ellipse&w=32 2x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=3&fm=png&h=32&mask=ellipse&w=32 3x"},"r48":{"src":"https://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&fm=png&h=48&mask=ellipse&w=48","srcSet":"https://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=1&fm=png&h=48&mask=ellipse&w=48 1x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=1.5&fm=png&h=48&mask=ellipse&w=48 1.5x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=2&fm=png&h=48&mask=ellipse&w=48 2x,\nhttps://www.datocms-assets.com/29850/1591833154-735890.jpg?auto=format&dpr=3&fm=png&h=48&mask=ellipse&w=48 3x"}},"bio":"株式会社クラフトマンソフトウェア代表 | Schoo講師 | 分報発祥の会社 | YYPHP主催 | マンガでわかるDocker監修 | 実践ドメイン駆動設計レビュア | 自動受け入れテスト ShouldBee http://shouldbee.at/"},"date":"2015年10月9日","tags":["github","chrome"],"category":"プロマネ","body":"<a href=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/d47c861e-5e25-40e7-89c5-06baf5a17e9d.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img width=\"1200\" alt=\"image.png (62.0 kB)\" src=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/d47c861e-5e25-40e7-89c5-06baf5a17e9d.png\"></a>\n<p data-sourcepos=\"3:1-4:109\">GitHubのウェブサイトでソースコードを見ているときにディレクトリやソースコードをいったりきたりしちゃうときがありますよね?<br>\nそんな時、エクスプローラみたいにナビゲーションツリーが出たら便利ですよね!</p>\n<p data-sourcepos=\"6:1-6:82\">今回は、それを実現するChrome拡張の「Octotree」を紹介します!!</p>\n<h1 data-sourcepos=\"8:1-8:57\" id=\"1-0-0\" name=\"1-0-0\">\n<a class=\"anchor\" id=\"まずは、Chrome Web Store からインストール!!\" name=\"%E3%81%BE%E3%81%9A%E3%81%AF%E3%80%81Chrome%20Web%20Store%20%E3%81%8B%E3%82%89%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB!!\" href=\"#%E3%81%BE%E3%81%9A%E3%81%AF%E3%80%81Chrome%20Web%20Store%20%E3%81%8B%E3%82%89%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB!!\" data-position=\"1-0-0\"><i class=\"fa fa-link\"></i><span class=\"hidden\" data-text=\"まずは、Chrome Web Store からインストール!!\"> &gt; まずは、Chrome Web Store からインストール!!</span></a>まずは、Chrome Web Store からインストール!!</h1>\n<p data-sourcepos=\"10:1-10:114\"><a href=\"https://chrome.google.com/webstore/detail/octotree/bkhaagjahfmjljalopjnoealnfndnagc\" target=\"_blank\" rel=\"noopener noreferrer\">Chrome Web Store / Octotree</a></p>\n<h1 data-sourcepos=\"12:1-12:29\" id=\"2-0-0\" name=\"2-0-0\">\n<a class=\"anchor\" id=\"さっそく使ってみる\" name=\"%E3%81%95%E3%81%A3%E3%81%9D%E3%81%8F%E4%BD%BF%E3%81%A3%E3%81%A6%E3%81%BF%E3%82%8B\" href=\"#%E3%81%95%E3%81%A3%E3%81%9D%E3%81%8F%E4%BD%BF%E3%81%A3%E3%81%A6%E3%81%BF%E3%82%8B\" data-position=\"2-0-0\"><i class=\"fa fa-link\"></i><span class=\"hidden\" data-text=\"さっそく使ってみる\"> &gt; さっそく使ってみる</span></a>さっそく使ってみる</h1>\n<p data-sourcepos=\"14:1-14:60\">使いかたは簡単! 左上の &gt; をクリックすると!</p>\n<a href=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/db2721e4-8f65-4cab-b48d-1fc3196facd5.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img width=\"1249\" alt=\"1.png (343.0 kB)\" src=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/db2721e4-8f65-4cab-b48d-1fc3196facd5.png\"></a>\n<p data-sourcepos=\"18:1-18:86\">↓ このようにナビゲーションツリーが表示されますね! すごい!!</p>\n<a href=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/36e3a33b-fbfd-484c-803d-3339758e959e.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img width=\"1249\" alt=\"2.png (395.6 kB)\" src=\"https://c16e-esa-io-public-files.s3-ap-northeast-1.amazonaws.com/uploads/production/attachments/15637/2020/05/28/18740/36e3a33b-fbfd-484c-803d-3339758e959e.png\"></a>\n<h1 data-sourcepos=\"22:1-22:32\" id=\"3-0-0\" name=\"3-0-0\">\n<a class=\"anchor\" id=\"実際つかっている様子\" name=\"%E5%AE%9F%E9%9A%9B%E3%81%A4%E3%81%8B%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E6%A7%98%E5%AD%90\" href=\"#%E5%AE%9F%E9%9A%9B%E3%81%A4%E3%81%8B%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E6%A7%98%E5%AD%90\" data-position=\"3-0-0\"><i class=\"fa fa-link\"></i><span class=\"hidden\" data-text=\"実際つかっている様子\"> &gt; 実際つかっている様子</span></a>実際つかっている様子</h1>\n<iframe width=\"420\" height=\"315\" src=\"https://www.youtube.com/embed/uKn4BrTyW9M\" frameborder=\"0\" allowfullscreen></iframe>\n<p data-sourcepos=\"26:1-26:119\">いいかんじですね!! 本連載ではバンバンGitHubを便利にするChrome拡張を紹介していきます!!</p>\n"}},"pageContext":{"id":"DatoCmsPost-5142970-ja","description":"GitHubのウェブサイトでソースコードを見ているときにディレクトリやソースコードをいったりきたりしちゃうときがありますよね? そんな時、エクスプローラみたいにナビゲーションツリーが出たら便利ですよね! 今回は、それを実現するChrome拡張の「Octotree」を紹介します!! まずは、Chrome Web Store からインストール!! Chrome Web Store / Octotree さっそく使ってみる 使いかたは簡単! 左上の > をクリックすると! ↓ このようにナビゲーションツリーが表示されますね! すごい!! 実際つかっている様子 いいかんじですね!! 本連載ではバンバン","toc":[{"tag":"h1","depth":1,"href":"#%E3%81%BE%E3%81%9A%E3%81%AF%E3%80%81Chrome%20Web%20Store%20%E3%81%8B%E3%82%89%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB!!","text":"まずは、Chrome Web Store からインストール!!","html":"まずは、Chrome Web Store からインストール!!"},{"tag":"h1","depth":1,"href":"#%E3%81%95%E3%81%A3%E3%81%9D%E3%81%8F%E4%BD%BF%E3%81%A3%E3%81%A6%E3%81%BF%E3%82%8B","text":"さっそく使ってみる","html":"さっそく使ってみる"},{"tag":"h1","depth":1,"href":"#%E5%AE%9F%E9%9A%9B%E3%81%A4%E3%81%8B%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E6%A7%98%E5%AD%90","text":"実際つかっている様子","html":"実際つかっている様子"}],"ogpImageUrl":"https://www.datocms-assets.com/29850/1593190022-pastedimage20200627146.png?fm=png&mark64=aHR0cHM6Ly93d3cuZGF0b2Ntcy1hc3NldHMuY29tLzI5ODUwLzE1OTMxNTQ2MzYtdHJhbnNwYXJlbnQtcGl4ZWwucG5nP3c9NDAwJmg9NjQmZml0PWNyb3AmYmxlbmQ2ND1hSFIwY0hNNkx5OTNkM2N1WkdGMGIyTnRjeTFoYzNObGRITXVZMjl0THpJNU9EVXdMekUxT1RFNE16TXhOVFF0TnpNMU9Ea3dMbXB3Wno5dFlYTnJQV1ZzYkdsd2MyVW1abTA5Y0c1bkpuYzlNalUySm1nOU1qVTImYmxlbmQtaD02NCZibGVuZC14PTAmYmxlbmQteT0wJmJsZW5kLW1vZGU9bm9ybWFsJm1hcms2ND1hSFIwY0hNNkx5OWhjM05sZEhNdWFXMW5hWGd1Ym1WMEwzNTBaWGgwUDNSNGRDMWhiR2xuYmoxdGFXUmtiR1VsTWtOc1pXWjBKblI0ZEMxbWIyNTBQWE5oYm5NdGMyVnlhV1lsTWtOaWIyeGtKblI0ZEMxamIyeHZjajB5TWpFNE1UWW1kSGgwTmpROVkyMVdkbU50YkhWYWR5WjBlSFF0YzJsNlpUMHpNQ1pvUFRZMCZtYXJrLXg9NjQmbWFyay1hbGlnbj1taWRkbGUlMkNsZWZ0&mark-align=bottom%2Cleft&mark-x=100&mark-y=496&blend64=aHR0cHM6Ly93d3cuZGF0b2Ntcy1hc3NldHMuY29tLzI5ODUwLzE1OTMxNTQ2MzYtdHJhbnNwYXJlbnQtcGl4ZWwucG5nP3c9MTIwMCZoPTYzMCZmaXQ9Y3JvcCZtYXJrNjQ9YUhSMGNITTZMeTkzZDNjdVpHRjBiMk50Y3kxaGMzTmxkSE11WTI5dEx6STVPRFV3THpFMU9UTXhOVEE1TkRBdFkzSmhablJ6YldGdUxUQXhMbkJ1WncmbWFyay1hbGlnbj10b3AlMkNjZW50ZXImbWFyay13PTI1MCZtYXJrLXk9ODAmYmxlbmQ2ND1hSFIwY0hNNkx5OWhjM05sZEhNdWFXMW5hWGd1Ym1WMEwzNTBaWGgwUDNSNGRDMWhiR2xuYmoxdGFXUmtiR1VsTWtOalpXNTBaWEltZEhoMExXWnZiblE5YzJGdWN5MXpaWEpwWmlVeVEySnZiR1FtZEhoMExYQmhaRDB4TURBbWRIaDBMV052Ykc5eVBUSXlNVGd4TmlaMGVIUTJORDAwTkVOUk5sbERhalpNZVVvME5FTlNTVVZrY0dSRmFERlpkVTlEYTNWUFEyZDFUMEp2TFU5Q2NVOVRMWFl0VjBseFpVOUNjWGxGWnpWWk5ubzJXVWMwVVRKb2VXSXlNV3cxYjNWb05XSjVNVWxUUldjME5FZGtORFJIZFUxbFQwRnFSVGxxWkVjNU1HTnRWbXcwTkVOT0puUjRkQzF6YVhwbFBUVTFKbmM5TVRJd01DWm9QVFl6TUEmYmxlbmQtbW9kZT1ub3JtYWw&blend-mode=normal","otherPost":{"type":"author","title":"KPTにGを足して、スクラムで最強のチームを作る!!","slug":"/posts/40"}}}}