diff --git a/app/controllers/announcements_controller.rb b/app/controllers/announcements_controller.rb
index 3124b60dc8c..95615c58c6a 100644
--- a/app/controllers/announcements_controller.rb
+++ b/app/controllers/announcements_controller.rb
@@ -6,7 +6,9 @@ class AnnouncementsController < ApplicationController
 
   def index; end
 
-  def show; end
+  def show
+    @announcements = Announcement.with_avatar.where(wip: false).order(published_at: :desc).limit(10)
+  end
 
   def new
     @announcement = Announcement.new(target: 'students')
diff --git a/app/views/announcements/_recent_announcements.html.slim b/app/views/announcements/_recent_announcements.html.slim
new file mode 100644
index 00000000000..c8f61b16c21
--- /dev/null
+++ b/app/views/announcements/_recent_announcements.html.slim
@@ -0,0 +1,13 @@
+.a-side-nav
+  .a-side-nav__inner
+    header.a-side-nav__header
+      h2.a-side-nav__title
+        | 最新のお知らせ
+    hr.a-border
+    .a-side-nav__body
+      .card-list
+        = render partial: 'home/announcement', collection: @announcements, as: :announcement
+    hr.a-border
+    footer.a-side-nav__footer
+      = link_to announcements_path, class: 'a-side-nav__footer-link' do
+        | 全てのお知らせ
diff --git a/app/views/announcements/show.html.slim b/app/views/announcements/show.html.slim
index 3cc34e3aca0..1767bc2588d 100644
--- a/app/views/announcements/show.html.slim
+++ b/app/views/announcements/show.html.slim
@@ -15,7 +15,9 @@ header.page-header
               | お知らせ一覧へ
 hr.a-border
 .page-body
-  .container.is-md
-    = render 'announcement', announcement: @announcement
-    #js-comments(data-commentable-id="#{@announcement.id}" data-commentable-type='Announcement' data-current-user-id="#{current_user.id}")
-    div(data-vue='Footprints' data-vue-footprintable-id="#{@announcement.id}" data-vue-footprintable-type='Announcement')
+  .page-body__inner.has-side-nav
+    .container.is-md
+      = render 'announcement', announcement: @announcement
+      #js-comments(data-commentable-id="#{@announcement.id}" data-commentable-type='Announcement' data-current-user-id="#{current_user.id}")
+      div(data-vue='Footprints' data-vue-footprintable-id="#{@announcement.id}" data-vue-footprintable-type='Announcement')
+    = render partial: 'recent_announcements'
diff --git a/test/system/announcements_test.rb b/test/system/announcements_test.rb
index 426fe51116c..4a30294bb78 100644
--- a/test/system/announcements_test.rb
+++ b/test/system/announcements_test.rb
@@ -268,4 +268,9 @@ class AnnouncementsTest < ApplicationSystemTestCase
     end
     assert_equal '.file-input', find('textarea.a-text-input')['data-input']
   end
+
+  test 'show the latest announcements' do
+    visit_with_auth "/announcements/#{announcements(:announcement1).id}", 'kimura'
+    assert_text '最新のお知らせ'
+  end
 end