Some Tools I Use As A GIS Developer

set of tools hanging on a wall

I’m teaming up with Harrisburg University to hold the first-ever GeoDev Summit in Harrisburg, Pennsylvania.  The event will be held on March 5, 2018, and will have technical sessions for experienced GIS Developers, as well as those just getting started.  As I’ve been considering what types of sessions to provide for new developers, I thought I’d share some “toolkit” resources I use as a GIS Developer.  These resources can fall into the following categories:

  1. Online code editors/sandboxes
  2. Project development/management
  3. Blogs & podcasts related to coding

Coding Playgrounds

The first type of resource I’ve found helpful are online code editors (sometimes called sandboxes).  These are browser-based applications that allow you to write and run code.  I typically use these for web development, but have started to dabble with running Python code.

These are great for testing small bits of code or even creating a full-fledged web map app.  They provide an easy way to share concept code, and I’ve seen them referenced when reporting issues for GitHub projects.  And as I recently purchased a Chromebook, these will be my go-to tools when writing code on that device.

CodePen

CodePen is the first sandbox I ever used, and still my favorite for web development.  Each project is called a “Pen.”  People can view your pen, and play around with the code in a “read-only” mode (signed in users can “fork” a project to save a copy to their account).  The pen provides four views while in editor mode: HTML, CSS, JavaScript, and Browser.   The Settings window allows you to add in links for CSS and JavaScript libraries, as well as use CSS and JavaScript pre-processors (SCSS, Babel, etc.).  For those wanting more features, you can upgrade to a paid account.

screenshot of the CodePen website
CodePen project for a Leaflet.js web map application

repl.it

Repl.it is an online code editor that supports a variety of languages (C#, JavaScript, Nodejs, Python, PHP, Ruby, etc.).  I haven’t used it much, but found it when searching for an online Python code editor.  The editor includes a code editor pane and console pane.  While there is some basic code hinting, it doesn’t seem to work with imported Python modules.

screenshot of repl.it online code editor
Writing some Python 2.7.x code

Esri API Sandboxes

As it’s the 800-lb. gorilla in the GIS world, I thought I’d mention Esri.  Though I haven’t written code with any of these projects, they do provide sandboxes for the JavaScript API and Python API.  They also have a bunch of sample code to help you get started.  I definitely want to learn both libraries in the near future.

esri JS api sandbox screen shot
Esri JavaScript API sandbox

 

esri python api sandbox screenshot
Esri’s Python API sandbox uses Juptyer notebooks

Website Development & Monitoring

GitHub provides a page featuring trending repositories.  I’ve found some project management and professional development guides by visiting this site.

Front-End-Checklist

Front End Checklist is a repository that provides a rather exhanustive checklist for web development projects.  They have ten categories and code items based upon high, medium, and low priority.  I plan to use this guide with new and existing projects.  This list can also be good for new developers to make you aware of the various components that go into developing a great website or web map app.

screenshot from the front end checklist website
Sample from the Front End Checklist

Google Analytics

There’s a lot that could be said about Google Analytics, and I haven’t even scratched the surface with this platform.  But I’ll share how I am using it.

  1. Track monthly usage for web map apps in terms of number of views and average time on app
  2. Document usage of web apps in terms of desktop browsers, as well as desktop vs. mobile vs. tablet usage

I recently read an article that pushed me to start testing each web map app on a monthly/bi-monthly basis.  This is basically routine maintenance to make sure the app is working as expected, and to note any issues to be resolved.  Because I am limited with how much I can devote to this, I decided to focus on the browsers that people are actually using for these sites.

screenshot of google analytics
Google Analytics for a web map app statistics on views from desktop, mobile, and tablet

Web Developer Roadmap

The Web Developer Roadmap is a great resource in identifying the various skillsets and platforms you may want to learn as a developer.  Obviously there are some other skills if you want to be a GIS Developer.  The project has a graphic for front-end developer, back-end developer, and DevOps.  There is really too much to learn in my mind, so I’m using this as a starting point, and then focusing in to create my own roadmap.  Below are some new skills I hope to learn within the next few years:

  • ES6 (newer JavaScript syntax)
  • Node.js, npm, Express
  • Webpack and/or requireJS
  • React or Vue
  • Esri JS API
  • Esri Python API
  • PHP
  • MySQL

Podcasts & Blogs

I wanted to close this post by listing a few podcasts and blogs related to coding. I’ll provide a link and brief description.

Podcasts:

Blogs:

  • Sitepoint – Articles geared toward developers covering topics from HTML to WordPress.  They offer a paid plan that includes access to e-books and courses.
  • CSS Tricks – Most articles are related to HTML/CSS, but there are also ones on JavaScript.  The site also includes an almanac and code snippet sections.
  • A List Apart – Articles related to web development from more a project management point of view.

Hopefully you’ve found the resources I’ve listed useful.  Are there resources you think new developers should be aware of? Please list them in the comments!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s