diff --git a/src/app/debugger.js b/src/app/debugger.js
index 1a12d231a1..2da026e869 100644
--- a/src/app/debugger.js
+++ b/src/app/debugger.js
@@ -11,6 +11,40 @@ function Debugger (id, appAPI, executionContextEvent, editorEvent) {
   this.sourceMappingDecoder = new remix.util.SourceMappingDecoder()
   this.el.appendChild(this.debugger.render())
   this.appAPI = appAPI
+  this.markers = {}
+  this.breakPointManager = new remix.code.BreakpointManager(this.debugger)
+  this.debugger.setBreakpointManager(this.breakPointManager)
+  this.breakPointManager.event.register('breakpointHit', (sourceLocation) => {
+    this.editor.setBreakpoint(this.touchedBreakpoint, 'breakpointUntouched')
+    var lineColumnPos = this.offsetToLineColumnConverter.offsetToLineColumn(sourceLocation, sourceLocation.file, this.editor, this.compiler.lastCompilationResult.data)
+    this.editor.setBreakpoint(lineColumnPos.start.line, 'breakpointTouched')
+    var self = this
+    setTimeout(function () {
+      self.editor.setBreakpoint(lineColumnPos.start.line, 'breakpointUntouched')
+    }, 5000)
+  })
+
+  function convertSourceLocation (self, fileName, row) {
+    var source = {}
+    for (let file in self.compiler.lastCompilationResult.data.sourceList) {
+      if (self.compiler.lastCompilationResult.data.sourceList[file] === fileName) {
+        source.file = file
+        break
+      }
+    }
+    source.start = self.offsetToLineColumnConverter.lineBreakPositionsByContent[source.file][row > 0 ? row - 1 : 0]
+    source.end = self.offsetToLineColumnConverter.lineBreakPositionsByContent[source.file][row]
+    source.row = row
+    return source
+  }
+
+  editorEvent.register('breakpointCleared', (fileName, row) => {
+    this.breakPointManager.remove(convertSourceLocation(this, fileName, row))
+  })
+
+  editorEvent.register('breakpointAdded', (fileName, row) => {
+    this.breakPointManager.add(convertSourceLocation(this, fileName, row))
+  })
 
   var self = this
   executionContextEvent.register('contextChanged', this, function (context) {
@@ -24,6 +58,7 @@ function Debugger (id, appAPI, executionContextEvent, editorEvent) {
   // unload if a file has changed (but not if tabs were switched)
   editorEvent.register('contentChanged', function () {
     self.debugger.unLoad()
+    self.removeMarkers()
   })
 
   // register selected code item, highlight the corresponding source location
@@ -56,6 +91,14 @@ Debugger.prototype.debug = function (txHash) {
   })
 }
 
+Debugger.prototype.switchFile = function (rawLocation) {
+  var name = this.editor.getCacheFile() // current opened tab
+  var source = this.compiler.lastCompilationResult.data.sourceList[rawLocation.file] // auto switch to that tab
+  if (name !== source) {
+    this.switchToFile(source) // command the app to swicth to the next file
+  }
+}
+
 /**
  * add a new web3 provider to remix
  *