Book Image

Elm Web Development

By : Ajdin Imsirovic
Book Image

Elm Web Development

By: Ajdin Imsirovic

Overview of this book

<p>Web development with JavaScript usually involves dealing with performance and maintenance issues. JavaScript fatigue makes it difficult for many developers to keep up with the increasing complexity posed by the multitude of JavaScript frameworks with changing versions, and the need to use different tools such as task runners, module bundlers, compilers, testing suites, linting and debuggers. Elm is an easy-to-learn, functional programming language that simplifies web development by eliminating the complexity associated with using JavaScript for web development. Elm is a statically typed language and thus makes a front end web developer's life easier by preventing run-time errors.</p> <p>You will begin by seeing the bigger picture of where Elm fits into the web development world and learning the basics of Elm programming. Firstly, you will get a taste for web development with Elm by developing a simple fizz-buzz app. Next you will get hands-on with advanced Elm concepts as you develop your own personal blogging website, a unit conversion app and a weather app with Elm. Finally, you will also learn how to integrate Elm with a Rails 5 app with the help of Webpack. By the end of the book you will have learned Elm programming, and its applications, and will appreciate how Elm simplifies web development for you.</p>

Related Content you might be interested in

Current Title:

Small book image
Elm Web Development
Ajdin Imsirovic
Mar, 2018 | 288 pages
Small book image
From PHP to Ruby on Rails
Bernard Pineda
Dec, 2023 | 244 pages
Small book image
Bootstrap 4 Cookbook
Ajdin Imsirovic
Jun, 2017 | 338 pages
Small book image
Vue.js Quick Start Guide
Ajdin Imsirovic
Oct, 2018 | 186 pages
Table of Contents (16 chapters)
Title Page
Title Page
www.packtpub.com
www.packtpub.com
Contributors
Contributors
Preface
Preface
Free Chapter
1
Why is This a Great Time to Learn Elm?
Why is This a Great Time to Learn Elm?
What is Elm?
Summary
2
Building Your First Elm App
Building Your First Elm App
Let's build an app
Values, expressions, data structures, and types in Elm
Building a simple FizzBuzz app in Elm
Summary
3
Creating Your Personal Portfolio with Elm
Creating Your Personal Portfolio with Elm
Creating our portfolio with elm-make-app
Building a static single-page portfolio
Improving our messages
Adding the type alias of Model
Working with List.map and List.filter
Revisiting the FizzBuzz app
Summary
4
Preparing a Unit Conversion Website in Elm
Preparing a Unit Conversion Website in Elm
What are we going to build?
Building our Unit Conversion app
Revisiting the FizzBuzz app
Summary
5
Completing the Unit Conversion Website in Elm
Completing the Unit Conversion Website in Elm
Improving the Unit Converter app
Adding type alias Model, initModel, and Main
A Bootstrap-based HTML layout for our app
Converting an HTML layout into an Elm view
Adding the improved view to our functioning app
Summary
6
Exploring Elm in Greater Detail
Exploring Elm in Greater Detail
Destructuring values in Elm
Dealing with randomness in Elm
Understanding partial application
Summary
7
Making a Weather App in Elm
Making a Weather App in Elm
Obtaining the weather data from a third-party API
What are we going to build?
Building our weather app
Installing the HTTP package
Adding all the imports
Conceptualizing the model
Setting up Msg union type
Updating the update function
Updating the view
Summary
8
Adding More Features to the Weather App
Adding More Features to the Weather App
Importing Material and Round modules
Adding elm-mdl to our Model
Updating the init function
Updating the Msg union type and the update function
Updating the view function
Adding color schemes
Updating decodeTemperatureInfo
Summary
9
Testing in Elm
Testing in Elm
Introduction to Elm testing
Writing unit tests in Elm
Writing fuzz tests in Elm
Summary
10
Integrating Elm with Rails
Integrating Elm with Rails
Setting up a basic Rails 5.1.5 app using Codeanywhere
Installing Ruby 2.5.0 and Rails 5.1.5 on Codeanywhere
Creating a brand new Rails project
Integrating Elm with Rails 5.1.5
Adding our Elm weather app to our Rails app
Summary
Other Books You May Enjoy
Other Books You May Enjoy
Leave a review - let other readers know what you think
Index
Index

Chapter 7. Making a Weather App in Elm

Welcome to Chapter 7, Making a Weather App in Elm. In this chapter, we will make our Elm-powered weather app. The purpose of this app is to learn how to fetch information from JSON and use it in our app.

The topics we will cover include:

  • Taking care of errors with Result
  • Dealing with optional values and nothingness using Maybe
  • Decoding JSON strings using decoders
  • Fetching remote data with the help of the HTTP package
  • Working with a third-party API

After completing this chapter, you will be able to:

  • Fetch information from the internet in JSON format
  • Have your Elm apps consume JSON data using decoders
  • Understand how all the moving parts fit together to build a functioning app

To begin, we will look at obtaining weather data from a third-party API.

Previous Section
End of Section 1
Next Section