diff --git a/db/migrations/0095__mime_type_for_render.sql b/db/migrations/0095__mime_type_for_render.sql
new file mode 100644
index 000000000..f23e43c12
--- /dev/null
+++ b/db/migrations/0095__mime_type_for_render.sql
@@ -0,0 +1 @@
+UPDATE notes SET mime = 'text/html' WHERE type = 'render';
\ No newline at end of file
diff --git a/src/entities/note.js b/src/entities/note.js
index ee5cc8367..fc4983d6a 100644
--- a/src/entities/note.js
+++ b/src/entities/note.js
@@ -40,7 +40,7 @@ class Note extends Entity {
     }
 
     isHtml() {
-        return (this.type === "code" || this.type === "file") && this.mime === "text/html";
+        return (this.type === "code" || this.type === "file" || this.type === "render") && this.mime === "text/html";
     }
 
     getScriptEnv() {
diff --git a/src/public/javascripts/services/note_detail_code.js b/src/public/javascripts/services/note_detail_code.js
index ee779f272..00ed4ca6b 100644
--- a/src/public/javascripts/services/note_detail_code.js
+++ b/src/public/javascripts/services/note_detail_code.js
@@ -64,24 +64,27 @@ function focus() {
 }
 
 async function executeCurrentNote() {
-    if (noteDetailService.getCurrentNoteType() === 'code') {
-        // make sure note is saved so we load latest changes
-        await noteDetailService.saveNoteIfChanged();
-
-        const currentNote = noteDetailService.getCurrentNote();
-
-        if (currentNote.mime.endsWith("env=frontend")) {
-            const bundle = await server.get('script/bundle/' + noteDetailService.getCurrentNoteId());
-
-            bundleService.executeBundle(bundle);
-        }
-
-        if (currentNote.mime.endsWith("env=backend")) {
-            await server.post('script/run/' + noteDetailService.getCurrentNoteId());
-        }
-
-        infoService.showMessage("Note executed");
+    // ctrl+enter is also used elsewhere so make sure we're running only when appropriate
+    if (noteDetailService.getCurrentNoteType() !== 'code') {
+        return;
     }
+
+    // make sure note is saved so we load latest changes
+    await noteDetailService.saveNoteIfChanged();
+
+    const currentNote = noteDetailService.getCurrentNote();
+
+    if (currentNote.mime.endsWith("env=frontend")) {
+        const bundle = await server.get('script/bundle/' + noteDetailService.getCurrentNoteId());
+
+        bundleService.executeBundle(bundle);
+    }
+
+    if (currentNote.mime.endsWith("env=backend")) {
+        await server.post('script/run/' + noteDetailService.getCurrentNoteId());
+    }
+
+    infoService.showMessage("Note executed");
 }
 
 $(document).bind('keydown', "ctrl+return", executeCurrentNote);
diff --git a/src/public/javascripts/services/note_detail_render.js b/src/public/javascripts/services/note_detail_render.js
index 75b001875..9d997eeb6 100644
--- a/src/public/javascripts/services/note_detail_render.js
+++ b/src/public/javascripts/services/note_detail_render.js
@@ -1,12 +1,51 @@
 import bundleService from "./bundle.js";
 import server from "./server.js";
 import noteDetailService from "./note_detail.js";
+import noteDetailCodeService from "./note_detail_code.js";
 
+const $noteDetailCode = $('#note-detail-code');
 const $noteDetailRender = $('#note-detail-render');
+const $toggleEditButton = $('#toggle-edit-button');
+const $renderButton = $('#render-button');
+
+let codeEditorInitialized;
 
 async function show() {
+    codeEditorInitialized = false;
+
     $noteDetailRender.show();
 
+    await render();
+}
+
+$toggleEditButton.click(() => {
+    if ($noteDetailCode.is(":visible")) {
+        $noteDetailCode.hide();
+    }
+    else {
+        if (!codeEditorInitialized) {
+            noteDetailCodeService.show();
+
+            codeEditorInitialized = true;
+        }
+        else {
+            $noteDetailCode.show();
+        }
+    }
+});
+
+$renderButton.click(render);
+
+async function render() {
+    // ctrl+enter is also used elsewhere so make sure we're running only when appropriate
+    if (noteDetailService.getCurrentNoteType() !== 'render') {
+        return;
+    }
+
+    if (codeEditorInitialized) {
+        await noteDetailService.saveNoteIfChanged();
+    }
+
     const bundle = await server.get('script/bundle/' + noteDetailService.getCurrentNoteId());
 
     $noteDetailRender.html(bundle.html);
@@ -14,8 +53,10 @@ async function show() {
     await bundleService.executeBundle(bundle);
 }
 
+$(document).bind('keydown', "ctrl+return", render);
+
 export default {
     show,
-    getContent: () => null,
+    getContent: noteDetailCodeService.getContent,
     focus: () => null
 }
\ No newline at end of file
diff --git a/src/public/javascripts/services/note_type.js b/src/public/javascripts/services/note_type.js
index 34922c2c9..d5de6b31d 100644
--- a/src/public/javascripts/services/note_type.js
+++ b/src/public/javascripts/services/note_type.js
@@ -4,6 +4,9 @@ import server from './server.js';
 import infoService from "./info.js";
 
 const $executeScriptButton = $("#execute-script-button");
+const $toggleEditButton = $('#toggle-edit-button');
+const $renderButton = $('#render-button');
+
 const noteTypeModel = new NoteTypeModel();
 
 function NoteTypeModel() {
@@ -107,7 +110,7 @@ function NoteTypeModel() {
 
     this.selectRender = function() {
         self.type('render');
-        self.mime('');
+        self.mime('text/html');
 
         save();
     };
@@ -128,6 +131,9 @@ function NoteTypeModel() {
 
     this.updateExecuteScriptButtonVisibility = function() {
         $executeScriptButton.toggle(self.mime().startsWith('application/javascript'));
+
+        $toggleEditButton.toggle(self.type() === 'render');
+        $renderButton.toggle(self.type() === 'render');
     }
 }
 
diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css
index e85b15f8a..1921b151d 100644
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -279,6 +279,10 @@ div.ui-tooltip {
     min-height: 200px;
 }
 
+#note-detail-render {
+    min-height: 200px;
+}
+
 .CodeMirror {
     font-family: "Liberation Mono", "Lucida Console", monospace;
     height: auto;
diff --git a/src/services/app_info.js b/src/services/app_info.js
index d0692660e..33d9f74f5 100644
--- a/src/services/app_info.js
+++ b/src/services/app_info.js
@@ -3,7 +3,7 @@
 const build = require('./build');
 const packageJson = require('../../package');
 
-const APP_DB_VERSION = 94;
+const APP_DB_VERSION = 95;
 
 module.exports = {
     appVersion: packageJson.version,
diff --git a/src/services/script.js b/src/services/script.js
index c2759ec1c..1e737c2bc 100644
--- a/src/services/script.js
+++ b/src/services/script.js
@@ -73,7 +73,7 @@ function getParams(params) {
 }
 
 async function getScriptBundle(note, root = true, scriptEnv = null, includedNoteIds = []) {
-    if (!note.isJavaScript() && !note.isHtml() && note.type !== 'render') {
+    if (!note.isJavaScript() && !note.isHtml()) {
         return;
     }
 
diff --git a/src/views/index.ejs b/src/views/index.ejs
index 9df679da6..c6bd928fd 100644
--- a/src/views/index.ejs
+++ b/src/views/index.ejs
@@ -95,6 +95,14 @@
 
           <span id="note-id-display" title="Note ID"></span>
 
+          <button class="btn btn-sm"
+                  style="display: none; margin-right: 10px"
+                  id="toggle-edit-button">Toggle edit</button>
+
+          <button class="btn btn-sm"
+                  style="display: none; margin-right: 10px"
+                  id="render-button">Render <kbd>Ctrl+Enter</kbd></button>
+
           <button class="btn btn-sm"
                   style="display: none; margin-right: 10px"
                   id="execute-script-button">Execute <kbd>Ctrl+Enter</kbd></button>