How I Built My Code Editor in Ruby

How I Built My Code Editor in Ruby

• 1.
  How I BuiltMy Code Editor in Ruby Andy Maleh Senior Developer Lexop
• 2.
  How Did IBuild My Code Editor in Ruby? ● I used Ruby as Programming Language (using JRuby) ● I applied Object Oriented Design (with abstractions like File and Dir) ● I applied Architectural Patterns (like MVC and MVP) ● I applied Design Patterns (like Command, Composite, Adapter & Observer) ● I used Domain Specific Languages (like Glimmer GUI DSL)
• 3.
  How Did IBuild My Code Editor in Ruby? ● I decomposed Software Modules (AKA Components AKA Custom Widgets) ● I reused Ruby Gems (like glimmer-dsl-swt, filewatcher, and clipboard) ● And, that's all folks! You can go home now! ● Just kidding! That was just a preview of the talk. Hang on for more.
• 4.
  About Myself ● Bachelorof Science in Computer Science from McGill University, Montreal ● Master of Science in Software Engineering from DePaul University, Chicago ● RubyConf 2008 + MagicRuby 2011 + MountainWest RubyConf 2011 + RailsConf 2012/2014 Speaker ● Fukuoka Ruby 2022 Special Award Winner ● Senior Full-Stack Developer at Lexop
• 5.
  Why Build aCode Editor in Ruby? ● Ruby is a great language: ○ Object Oriented ○ Dynamically Typed ○ Inspired by Lisp, Smalltalk, Perl, Python, and Basic ○ Supports Meta-Programming and Embedded DSLs ○ Highly Expressive and Maintainable Code ○ Very Productive (e.g. Rails)
• 6.
  Why Build aCode Editor in Ruby? ● I am a senior software engineer: ○ Proficient in Requirements Engineering ○ Proficient in Object Oriented Programming ○ Proficient in Architectural Patterns (e.g. MVC) ○ Proficient in Design Patterns ○ Proficient in Domain Specific Languages ○ Proficient in Writing Highly Maintainable Code ○ Proficient in Automated Testing
• 7.
  Code Editor (Gladiator)Demo
• 8.
  Gladiator Software Architecture ●MVC
• 9.
  Gladiator Software Architecture ●MVP ● Data-Binding
• 10.
  Gladiator Software Architecture ●Software Modules (AKA Components AKA Custom Widgets) ○ Gladiator ○ TextEditor ○ FileExplorerTree ○ FileLookupList ○ FileEditMenu ○ GladiatorMenuBar ○ ProgressShell
• 11.
  Software Development Process ●Avoid using any editor other than built-in VIM while building Gladiator ● Start small and add features incrementally to Gladiator ● Eat own dog food by using Gladiator to build more Gladiator features
• 12.
  Software Development Process ●Glimmer Process is simply made up of 7 guidelines to pick and choose as necessary until software development needs are satisfied. Not all guidelines need to be incorporated into every project, but it is still important to think through every one of them before ruling any out. Guidelines can be followed in any order. ○ Requirements Gathering ○ Software Architecture and Design Diagrams ○ Initial Release Plan ○ Small Releases ○ Usability Testing ○ Automated Tests ○ Refactoring
• 13.
  Implementation of GladiatorFeatures ● File Tree Navigation ● File Lookup by Name ● Text Editor With Syntax Highlighting for Over 30 Programming Languages ● Tabs ● Find and Replace
• 14.
  Implementation of GladiatorFeatures ● Keyboard Shortcuts ● Undo/Redo via Command Pattern (and Adapter Pattern) ● Split Pane ● Menus ● Run Ruby Code
• 15.
  Implementation of GladiatorFeatures ● Watching external file/directory changes ● Remembering Last Open Files ● Ignoring Irrelevant Paths
• 16.
  Future Features ● Filecontent search (right now I use grep for that) ● Themes (right now there is internal support for theme that is not exposed) ● Extensions (right now, code is open source, so people can fork to extend) ● Better Windows and Linux support (I mostly use on the Mac)
• 17.
  Q & A https://github.com/AndyObtiva/glimmer-cs-gladiator https://github.com/AndyObtiva/glimmer-dsl-swt https://github.com/AndyObtiva https://andymaleh.blogspot.com/ https://twitter.com/AndyObtiva