JSFoo 2019

On component architecture, front-end engineering and Developer Experience (DX)

Learn to build robust user interfaces using ReasonML, React, and ReasonReact

Submitted by Jasim A Basheer (@jasim) on Aug 29, 2019

Section: Workshop Technical level: Intermediate Status: Confirmed

Abstract

Details of this workshop are published here: https://hasgeek.com/jsfoo/2019-reasonml-workshop/

You don’t need any prior experience in front-end development (HTML, CSS, or Javascript), functional programming, or static types. Instead, in this workshop we will approach user interface development as a well-defined subset of programming at large.

You should attend this workshop if:

  • you are a back-end web developer or a systems programmer who want to be able to build web applications end-to-end.

  • or if you are an experienced front-end developer who want to supercharge your craft by building robust user interfaces with types, functional programming, and ReasonML.

Learning Outcomes

  • Recognize fundamental UI patterns independent of frameworks
  • Make invalid UI states impossible
  • Build beautiful interfaces without a designer
  • Production-grade functional programming
  • Understand Hindley-Milner based type system of ReasonML

Mailchimp Interactive Password Analyzer & Cleartrip flight booking console

Outline

Part 1
- Introduction to Reason, static types, and functional programming
- Introduction to React & ReasonReact for building user interfaces

Part 2
- Implementing a design system
- Implementing fundamental UI patterns

Requirements

  npm install --global bs-platform
  bsb -init my-react-app -theme react-hooks
  cd my-react-app && npm install && npm start
  # in another tab
  npm run webpack
  • You need to have VSCode installed which we’ll be using for the workshop. You also need to install the VSCode Reason plugin, which provides type hints and code formatting support.

Speaker bio

Sherin and Jasim are programmers with over a decade’s experience in building software across the stack. We build Protoship Codegen - a tool that converts vector designs into responsive HTML & CSS. We’ve been writing Reason/OCaml and ReasonReact professionally for over two years and have used it to build rich web applications, API endpoints, and extensions for Sketch and Adobe XD. We’ve helped build RubyMonk, created learn-reasonml-workshop, and have trained programmers in Reason both online and through in-person workshops.

Links

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('You need to be a participant to comment.') }}

{{ formTitle }}
{{ gettext('Post a comment...') }}
{{ gettext('New comment') }}

{{ errorMsg }}