Cover image for Isomorphic Go

Isomorphic Go

Author Kamesh Balasubramanian
Release Date: 2017/12/01
ISBN: 9781788394185
Topic:
0%
341
Chapters
0-1
Hours read
0k
Total Words
    Start Reading Now    
       Add to Wishlist       
View table of contents

Book Description

Learning about isomorphic development in Go leads to a unified view of web and back-end development: It extends the remit of a server-side programming language to the browser.

About This Book

  • Learn how to build Isomorphic Go web applications
  • Neatly organize your isomorphic codebase to enhance the maintainability of your application
  • Leverage the same Go code across the web server and the web browser

Who This Book Is For

This book addresses web developers, who are comfortable with JavaScript and the full web development cycle. You may or may not be experienced in isomorphic development, but should have a basic understanding of Go's syntax.

What You Will Learn

  • Create Go programs inside the web browser using GopherJS
  • Render isomorphic templates on both the client side and the server side
  • Perform end-to-end application routing for greater search engine discoverability and an enhanced user experience
  • Implement isomorphic handoff to seamlessly transition state between the web server and the web browser
  • Build real-time web application functionality with websockets
  • Create reusable components (cogs) that are rendered using the virtual DOM
  • Deploy an Isomorphic Go application for production use

In Detail

Isomorphic Go is the methodology to create isomorphic web applications using the Go programming language. Isomorphic web applications have the capability to reuse code across environments, increasing the synergy between the web server and the web browser. This book is a hands-on guide that will show you how to build and deploy an Isomorphic Go web application.

Isomorphic Go begins with an in-depth exploration of the benefits provided by the isomorphic web application architecture. You'll be introduced to the Isomorphic Go toolchain, and how it can help you write Go code that functions across environments. You'll learn how to create Go programs in the web browser using GopherJS and how to render isomorphic templates. Then you'll be introduced to end-to-end application routing, use isomorphic handoff to seamlessly transition state from the web server to the web browser, and compose isomorphic forms that have the ability to reuse form validation logic. You'll be exposed to advanced concepts including the implementation of real-time web application functionality with websockets and the creation of reusable components (cogs) that are rendered using the virtual DOM. Finally, you'll see how to deploy an Isomorphic Go web application to a production environment.

Style and Approach

Kamesh guides beginner Go developers and JavaScript developers with basic Go syntax skills through a full Go tutorial until they emerge with a working knowledge of isomorphic Go development.

Downloading the example code for this book You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Table of Contents

  1. Preface
    1. What this book covers
    2. What you need for this book
    3. Who this book is for
    4. Conventions
    5. Reader feedback
    6. Customer support
      1. Downloading the example code
      2. Errata
      3. Piracy
      4. Questions
  2. Isomorphic Web Applications with Go
    1. Why Isomorphic Go?
      1. Go comes with type checking
      2. Avoiding Vanilla JavaScript with transpilers
      3. Transpiling code
      4. Benefits of Go on the front-end
        1. Robust standard library
        2. Promoting modularization using Go packages
        3. An implicit build system
        4. Avoiding callback hell
        5. Concurrency
        6. Isomorphic web application development using Go
    2. An overview of web application architectures
    3. The classic web application architecture
      1. Advantages
        1. Faster initial page loads
        2. Greater search engine discoverability
      2. The primary disadvantage
    4. The AJAX web application architecture
      1. The primary advantage
      2. Disadvantages
        1. Mental context shifts
        2. Increased rendering complexity
        3. Duplication of efforts
    5. The single page application (SPA) architecture
      1. The primary advantage
      2. Disadvantages
        1. Slower initial page loads
        2. Reduced search engine discoverability
    6. The isomorphic web application architecture
      1. Wish list fulfilled
        1. 1. Enhancing the user experience
        2. 2. Increasing the maintainability
        3. 3. Increasing the efficiency
        4. 4. Increasing the productivity
        5. 5. Making the best first impression
        6. 6. Promoting discoverability
    7. Live demo
    8. Measurable benefits
    9. Nomenclature
    10. Prerequisites
    11. Summary
  3. The Isomorphic Go Toolchain
    1. Installing the Isomorphic Go toolchain
      1. Go
        1. Installing Go
        2. Setting up your Go workspace
        3. Building and running Go programs
      2. GopherJS
        1. Installing GopherJS
        2. Installing essential GopherJS bindings
          1. dom
          2. jsbuiltin
          3. xhr
          4. websocket
        3. Getting familiar with GopherJS on the command line
      3. The Isomorphic Go toolkit
        1. Installing isokit
      4. The UX toolkit
        1. Installing the cog package
    2. Setting up the IGWEB demo
      1. Setting up the application root environment variable
      2. Transpiling the client-side application
      3. Setting up Redis
      4. Running the IGWEB demo
      5. Loading the sample dataset
      6. Using kick
        1. Installing kick
        2. Running kick
        3. Verify that kick is working
    3. An introduction to the IGWEB demo
      1. Building IGWEB from the ground up
      2. The IGWEB roadmap
        1. The home page
        2. The about page
        3. The products page
        4. The shopping cart feature
        5. The contact page
        6. The live chat feature
        7. Reusable components
    4. Project structure and code organization
      1. The MVC pattern
      2. The custom datastore
      3. Dependency injections
    5. Summary
  4. Go on the Front-End with GopherJS
    1. The Document Object Model
      1. Accessing and manipulating the DOM
    2. Basic DOM operations
      1. Displaying an alert message
      2. Getting a DOM element by ID
      3. Query selector
      4. Changing the CSS style property of an element
    3. GopherJS overview
      1. The GopherJS transpiler
    4. GopherJS examples
      1. Displaying an alert message
      2. Changing an element's CSS style property
      3. The JavaScript typeof operator functionality
      4. Transforming text to lowercase using an XHR post
    5. Inline template rendering
      1. The cars listing demo
      2. Transmitting gob encoded data
    6. Local storage
      1. Common local storage operations
        1. Setting a key-value pair
        2. Getting a value for a given key
        3. Getting all key value pairs
        4. Clearing all entries
      2. Building a local storage inspector
      3. Creating the user interface
      4. Setting up the server-side route
      5. Implementing the client-side functionality
        1. Initializing the local storage inspector web page
        2. Implementing the local storage inspector
      6. Running the local storage demo
    7. Summary
  5. Isomorphic Templates
    1. The web template system
      1. The template engine
      2. The template data object
      3. The templates
    2. IGWEB page structure 
      1. The header
        1. The top bar
        2. The navigation bar
      2. The primary content area
      3. The footer
    3. Template categories
      1. Layout templates
        1. The web page layout template
      2. Partial templates
        1. The header partial template
        2. The top bar partial template
        3. The navigation bar partial template
        4. The footer partial template
      3. Regular templates
        1. The page template for the about page
        2. The content template for the about page
    4. Custom template functions
    5. Feeding data to the content template
    6. Isomorphic template rendering
      1. Limitations of filesystem-based template rendering 
      2. The in-memory template set
      3. Setting up the template set on the server side
      4. Registering the server-side handlers
      5. Serving the template bundle items
      6. Rendering the about page from the server side
      7. Setting up the template set on the client side
        1. Creating the client-side router
        2. Registering the client-side route
      8. Initializing interactive elements on the web page
      9. Rendering the about page from the client side
        1. The gopher team Rest API endpoint
    7. Summary
  6. End-to-End Routing
    1. Routing perspectives
      1. Routing on the server side
      2. Routing on the client side
    2. Design of the product-related pages
    3. Implementing product-related templates
      1. Implementing the templates for the products listing page
      2. Implementing the templates for the product detail page
    4. Modeling product data
    5. Accessing product data
      1. Retrieving products from the datastore
      2. Retrieving the product detail from the datastore
    6. Registering server-side routes with Gorilla Mux
    7. Server-side handler functions
      1. The handler function for the products listing page
      2. The handler function for the product detail page
    8. Registering client-side routes with the isokit router
    9. Client-side handler functions
      1. The handler function for the products listing page
        1. Fetching the list of products
      2. The handler function for the product detail page
        1. Fetching the product detail
    10. Rest API endpoints
      1. The endpoint to get the list of products
      2. The endpoint to get the product detail
      3. Verifying the client-side routing functionality
    11. Summary
  7. Isomorphic Handoff
    1. The isomorphic handoff procedure
      1. The ERDA strategy
        1. The Encode step
        2. The Register step
        3. The Decode step
        4. The Attach step
    2. Implementing isomorphic handoff for the product-related pages
      1. Implementing the sort interface for the product model
      2. Implementing isomorphic handoff for the products listing page
      3. Implementing isomorphic handoff for the product detail page
    3. Implementing isomorphic handoff for the shopping cart
      1. Designing the shopping cart page
      2. Implementing the shopping cart templates
        1. The template data object
      3. Modeling the shopping cart
      4. Shopping cart routes
        1. Fetching a list of items
        2. Adding an item
        3. Removing an item
      5. The session store
      6. The server-side shopping cart handler function
      7. Shopping cart endpoints
        1. The endpoint to get items in the shopping cart
        2. The endpoint to add items to the shopping cart
        3. The endpoint to remove items from the shopping cart
      8. Implementing the shopping cart functionality on the client side
        1. Rendering the shopping cart
        2. Removing an item from the shopping cart
        3. Adding an item to the shopping cart
      9. Verifying the shopping cart functionality
    4. Summary
  8. The Isomorphic Web Form
    1. Understanding the form flow
    2. Designing the contact form
      1. Implementing the templates
    3. Validating email address syntax
    4. The form interface
    5. Implementing the contact form
      1. Registering the contact route
      2. The contact route handler
      3. The contact confirmation route handler
      4. Processing the contact form submission
    6. The accessible contact form
      1. The contact form can function without JavaScript
    7. Client-side considerations
    8. Contact form Rest API endpoint
    9. Checking the client-side validation
      1. Tampering with the client-side validation result
    10. Summary
  9. Real-Time Web Application Functionality
    1. The live chat feature
      1. Designing the live chatbox
      2. Implementing the live chat box templates
    2. Implementing the live chat's server-side functionality
      1. The hub type
      2. The client type
      3. Activating the chat server
      4. The agent's brain
      5. Greeting the human
      6. Replying to a human's question
      7. Exposing the agent's information to the client
    3. Implementing the live chat's client-side functionality
      1. Creating the live chat client
      2. Initializing the event listeners
      3. The close chat control
      4. Setting up event listeners for the WebSocket object
      5. Handling a disconnection event
    4. Conversing with the agent
    5. Summary
  10. Cogs – Reusable Components
    1. Essential cog concepts
      1. The UX toolkit
      2. The anatomy of a cog
      3. The virtual DOM tree
      4. The life cycle of a cog
    2. Implementing pure cogs
      1. The time ago cog
      2. The live clock cog
    3. Implementing hybrid cogs
      1. The date picker cog
      2. The carousel cog
      3. The notify cog
    4. Summary
  11. Testing an Isomorphic Go Web Application
    1. Testing the server-side functionality
      1. Go's testing framework
        1. Verifying server-side routing and template rendering
        2. Verifying the contact form's validation functionality
        3. Verifying a successful contact form submission
    2. Testing the client-side functionality
      1. CasperJS
        1. Verifying client-side routing and template rendering
        2. Verifying the contact form
        3. Verifying the shopping cart functionality
        4. Verifying the live chat feature
        5. Verifying the time ago cog
        6. Verifying the live clock cog
        7. Verifying the date picker cog
        8. Verifying the carousel cog
        9. Verifying the notify cog
    3. Summary
  12. Deploying an Isomorphic Go Web Application
    1. How IGWEB operates in production mode
      1. GopherJS-produced JavaScript source file
      2. Taming the GopherJS-produced JavaScript file size
      3. Generating static assets
    2. Deploying an Isomorphic Go web application to a standalone server
      1. Provisioning the server
      2. Setting up the Redis database instance
      3. Setting up the NGINX reverse proxy
        1. Enabling GZIP compression
        2. Proxy settings
      4. Setting up the IGWEB root folder
      5. Cross compiling IGWEB
      6. Preparing the deployment bundle
      7. Deploying the bundle and starting IGWEB
      8. Running IGWEB
        1. Running IGWEB in the foreground
        2. Running IGWEB in the background
        3. Running IGWEB with systemd
    3. Deploying an Isomorphic Go web application using Docker
      1. Installing Docker
      2. Dockerizing IGWEB
      3. The Dockerfile
      4. The Dockerfile for a closed source project
      5. Docker compose
      6. Running Docker compose
      7. Setting up the dockerized IGWEB service
    4. Summary
  13. Debugging Isomorphic Go
    1. Identifying compiler/transpiler errors
    2. Examining panic stack traces
    3. Tracing code to pinpoint the source of issues
18.225.255.187