Getting a WebSharper project up and running on Mac OS X

A few weeks ago, this post about Intellifactory's WebSharper showed up on Hacker News.  The top comment was enthusiastic enough for me to check it out.

Since F# and Mono came out of the Microsoft ecosystem and I use Mac for development (and Linux for deployment), I had to do some digging to get things working.  These are the steps I used to get a basic WebSharper app up and running on Mac OS X (10.9.x).   Note that these steps are very high level and don't go into much detail.

1. Install Xamarin Studio


I've used Xamarin Studio at work to create several cross-platform mobile apps.  Being comfortable with that environment, I elected to go with Xamarin Studio for F#/WebSharper development.   You can find the download here.  Note that you will have to supply some personal info to proceed.

Once the install begins, you will eventually get to this screen:




In order for the install to work, you'll have to select at least one of the products in the list.  For the purposes of doing WebSharper development, I don't think it matters which one(s) you choose.

Once you get to the "Install Succeeded" screen, click the "Launch Xamarin Studio" button:



If you had already quit the install process, you can find Xamarin Studio in your Applications folder.  When Xamarin Studio launches, it may have updates waiting.  If so, click the "Restart and Install Updates" button.

2. Install Intellifactory's WebSharper Add-in


To make working with WebSharper in Xamarin Studio easier, Intellifactory provides the WebSharper add-in.  Installing the add-in will add project templates that make creating WebSharper applications easier.  Click the "Xamarin Studio" menu, then choose "Add-in Manager...":



With the Add-in Manager window open, click the "Gallery" tab, then click the "Repository" drop-down and choose "Manage Repositories...":



From the "Add-in Repository Management" window,  click the "Add" button.



Then paste the following URL into the "Register an on-line repository" URL field:

https://raw.githubusercontent.com/intellifactory/monodevelop.websharper/master/repository/


...and click the "OK" button.  Eventually, the add-in will finish installing.  At this point,  Xamarin Studio is ready for creating WebSharper applications.

3. Create your first WebSharper Sitelet.


There are several different kinds of WebSharper projects.  We're going to create an app that has both a client and server piece, known as a "Sitelet".  

Close all windows until you get back to the main Xamarin Studio screen.  Then click the "New Solution..." button.  In the "New Solution" window, find the WebSharper entry in the list in the left-hand pane (it's probably the last entry), then choose "WebSharper Sitelets Website".



Fill in a Name (I chose HelloWorld), make sure the project will be created in a directory you agree to,  then click the "OK" button.

4. Build the Project


At this point, you now have a basic example starter project ready to explore.  Let's see it in action.  Before we can run it, we need to build it.  Choose the "Build" menu item, then "Build HelloWorld".  If everything went well, you should see a "Build successful." message.



5. Run


From what I can tell, there's no way to run the application from inside Xamarin Studio yet.  Open Terminal, then navigate to your project's directory.  You need to be in the directory below the top-level similarly-named directory, in my case HelloWorld/HelloWorld:




Once there, type the following on the command line:

xsp4

This will start the xsp4 web server.  You should see a "Listening on port: 8080..." message.  Open a web browser to http://localhost:8080 and your app should display:




Congratulations!  If you got this far, you now have a development environment all set up to create the next amazing WebSharper application.

Where to go from here


This post just explained how to get a dev environment up and running.   There is a BUNCH to learn.  Try exploring the different pieces of the project, particularly the Main.fs, Client.fs, and Remoting.fs files.  Keep in mind that if you make any changes, you will have to rebuild the project, and re-run the server.

I am new to F# and WebSharper, but here's what I've been looking at:


Resources Used:


Most of the information I used for this post was gleaned from the following:

  • The F# Software Foundation's Use F# on Mac OSX page.
  • This Intellifactory blog post.

If you liked this post, would like to see more posts on F#/WebSharper, or have corrections or criticisms, please leave a comment or let me know on twitter.  Good luck exploring!


Eon: A Clojure Basics Quiz

As part of an effort to avoid creating yet another blog engine, I started working on something completely different:  a quiz/game called Eon.


Eon is a simple quiz designed to test basic Clojure evaluation comprehension.  At the moment, it consists of 7 levels of 10 questions.  Each question presents you with a Clojure form.  You are given an answer box to submit your answer.  An answer is initially worth 100 points.  Entering an incorrect answer drops the possible point value by 10, so a perfect score at this point is 7000 (7 levels x 10 questions per level x 100 points).

I started writing Eon for a few reasons:

  • I wanted to get out of a rut where every personal project started to look like a blog engine.
  • I wanted to learn ClojureScript.  There are lots of interesting things happening in ClojureScript lately, and I wanted to get my feet wet.  Eon is written in ClojureScript with Reagent handling the UI.
  • Working on this helped solidify my understanding of simple Clojure evaluation.
Eon is very basic, but I hope that other Clojure beginners out there find it useful.  There are levels/questions that I'd like to add, but due to some limitations in the way I'm handling answers, I'm not sure I'll get to them.  Plus, I'm already itching to create something more substantial using ClojureScript--it's a lot of fun to work with.

If you have questions, comments, or find bugs/see something wrong, please let me know via email or on Twitter.

2014 Clojure Cup Ideas

Clojure Cup 2014 is just around the corner.  If you're excited about entering but don't have a clue what to make, maybe this post will help you.  Below is a small collection of web app ideas I've had recently that I probably won't get to.  I jot these things down whenever they pop into my head regardless of how ridiculous or difficult they seem.  Most of them sit in a text file doing nothing.  Maybe some of them can help someone directly or spark other ideas.  I think the core functionality for most of these could be pulled off in a 48-hour period.  Some may already exist, but attempting to build them might yield useful knowledge, or even win you the cup!

Storytellers

Connect with up to 3 others and collaboratively build a story by taking turns writing in units of paragraph, sentence, or word.  Once the story is finished, publish it to a reading section of the site for others to read.

Version Check

Upload a project.clj file to this web service and you'll be told which libraries you're using that have newer versions.

Destination Helper

Specify a travel destination + dates of travel and get back details about the destination for that time period:  weather, events, the most recent highly-rated restaurant reviews, etc.

Web-based Podcatcher

Log in, subscribe to feeds and listen without the need for a dedicated app.   Is it possible to supplant native apps with a web offering?

Due Today

Yes, this is another TODO list, but it's the only one I've been able to use consistently.  You're only allowed to add items to today's date.  If you don't complete an item, you have the option to move it to today from an earlier date.  The focus is on entering actionable steps that can be achieved today.

Single Subject Search Engine

Indexing the entire internet is impossible for a sole developer with a VPS.  Would it be possible to index a niche subject?  What advantages would you have over a general search engine?

Source Code Recommender

You've learned the basics of a new language.  You've solved some puzzles.  You're still not comfortable writing in the language.  Where do you go to see how advanced users of the language use it?  With Source Code Recommender, reviewers can submit code repos that they think exemplify the best practice patterns and idioms of a language and rate/discuss/review/educate based on the source.

Goodreads Reviewer Suggester

Given your account, this site uses the Goodreads API to find other users that ranked books similarly to you.   Receive suggestions for users to follow, books to read, or discussions to take part in.

Newsletter Aggregator

Email newsletters have taken off in popularity.  This service aggregates all of your newsletters in one place.  Sign up for an account and the service will supply you with an email address to use when signing up for newsletters.  The aggregator then provides you with an interface for reading/managing/tagging/searching your newsletters.

Monument

Memories for locations.  Search for a location on a map and add a memory (anonymously if you want) about that particular place/establishment/location.  Flaco's Tacos, I still miss you.

IT Interview Quiz

A site that quizzes you on those silly puzzles (and/or useful CS theory) that some companies use to filter the hiring pool.  Submit answers to quizzes (anonymously if you want) and have them reviewed/rated by others and learn from other member's submissions.  This is kind of an Exercism.io for theory.

If one of these appeal to you, take it and run with it.  Good luck and see you at Clojure Cup!

P.S.  If you use one of these and anything good comes out of it, you should buy me a burrito!

P.P.S.  If you're interested in making one of these outside of Clojure Cup and want a collaborator, let me know via email or on Twitter.