NASA Astronomy Picture of the Day

Here is my first attempt of building a single HTML page, using the RSS feed taken from NASA Astronomy Picture of the Day (APOD)

The application written in Go carries out the following.

  • makes a HTTP request for the RSS feed

  • process the XML feed data

  • display feed data on a single HTML page

RSS Feed

Here’s what the feed data looks like.

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
      <description>Astronomy Picture of the Day</description>
         <title>Eclipse under the ISS</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="The dark shadow of the New Moon reached out and touched planet Earth on" border="0" /&gt;&lt;/a&gt; The dark shadow of the New Moon reached out and touched planet Earth on&lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Eclipse under the Bamboo</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="Want to watch a solar eclipse safely?" border="0" /&gt;&lt;/a&gt; Want to watch a solar eclipse safely?&lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Eclipse Street, Hong Kong</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="Eclipse Street, Hong Kong" border="0" /&gt;&lt;/a&gt; Eclipse Street, Hong Kong&lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Inverted City Beneath Clouds</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="How could that city be upside-down?" border="0" /&gt;&lt;/a&gt; How could that city be upside-down?&lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>The X Ray Sky from eROSITA</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="What if you could see X-rays? " border="0" /&gt;&lt;/a&gt; What if you could see X-rays? &lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Moon Mountains Magnified during Ring of Fire Eclipse</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="What are those dark streaks in this composite image of yesterday's solar eclipse?" border="0" /&gt;&lt;/a&gt; What are those dark streaks in this composite image of yesterday's solar eclipse?&lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Moon Occults Venus</title>
         <description>&lt;p&gt;&lt;a href=""&gt;&lt;img src="" align="left" alt="It may look like " border="0" /&gt;&lt;/a&gt; It may look like &lt;/p&gt;&lt;br clear="all"/&gt;</description>
         <title>Search APOD</title>
         <description>Search APOD</description>

Making a HTTP request

func makeRequest(done chan<- nasaRSS) {
    client := httpClient()

    req, err := http.NewRequest("GET", requestURL, nil)


    resp, err := client.Do(req)

    if resp.StatusCode != 200 {
            body, _ := ioutil.ReadAll(resp.Body)
            log.Fatal("Request status = ", resp.StatusCode)


    defer resp.Body.Close()

    var responseBody nasaRSS

    body, err := ioutil.ReadAll(resp.Body)


    xml.Unmarshal(body, &responseBody)

    done <- responseBody


Parses the XML-encoded data and stores the result in the value responseBody which is of a new type created nasaRss

Processing the feed data

A struct was created to encapsulate the data.

Notice the fields map to each element within the RSS XML feed.

The purpose of this struct was to ensure

// nasaRSS declaring struct
type nasaRSS struct {
    XMLName xml.Name `xml:"rss"`
    Text    string   `xml:",chardata"`
    Version string   `xml:"version,attr"`
    Channel struct {
            Text        string `xml:",chardata"`
            Title       string `xml:"title"`
            Link        string `xml:"link"`
            Description string `xml:"description"`
            Language    string `xml:"language"`
            Image       struct {
                    Text  string `xml:",chardata"`
                    Title string `xml:"title"`
                    URL   string `xml:"url"`
                    Link  string `xml:"link"`
            } `xml:"image"`
            Item []struct {
                    Text        string `xml:",chardata"`
                    Title       string `xml:"title"`
                    Link        string `xml:"link"`
                    Description string `xml:"description"`
            } `xml:"item"`
            TextInput struct {
                    Text        string `xml:",chardata"`
                    Title       string `xml:"title"`
                    Description string `xml:"description"`
                    Name        string `xml:"name"`
                    Link        string `xml:"link"`
            } `xml:"textInput"`
    } `xml:"channel"`


<description>&lt;p&gt;&lt;a href=""
&gt;&lt;img src="" 
align="left" alt="It may look like " border="0" /&gt;&lt;/a&gt; It may look like &lt;/p&gt;&lt;br clear="all"/&gt;

The text inside the <description> tag contains escaped HTML since it’s XML encoded.

This also contains an <img> tag.

In order to extract the information out of the description tag.

A regex was used to pull the img src (thumbnail) and description out.

func parseDescription(str string, opt string) string {

        switch opt {
        case "img":
                r, _ := regexp.Compile(`<img src\s*=\s*"(.+?)"`)
                return r.FindStringSubmatch(str)[1]

        case "desc":
                r, _ := regexp.Compile(`alt\s*=\s*"(.+?)"`)
                return r.FindStringSubmatch(str)[1]
                panic("Invalid option for parsing description.")


In the end the extracted values look like.

Description = “It may look like”

Img src =


In order to generate the dynamic content inside an HTML page, the go package html/template was used.

This package allowed dynamic injection of data to be inserted at runtime.


Another struct was used to help with the rendering of the HTML page.

type htmlRender struct {
    Title       string
    Link        string
    ImgSrc      string
    Description string

From the below HTML code example.

Field Template notation Description
N/A {{range $items := .}} Loop a list of items, in this case these are the entries taken from the XML feed
Title {{.Title}} Display the title of the individual item taken from the RSS feed
Description {{.Description}} Display the description content
ImgSrc {{.ImgSrc}} Used to display the image
<!DOCTYPE html>


    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href=""
        integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src=""
    <script src=""
    <script src=""

    <div class="container">
        <p class="text-center"><a href="" target="_blank"> Astronomy Picture of the Day</a></p>
        <div class="row">
            <div class="col-sm" style="width: 40rem;">
                {{range $items := .}}
                <div class="card">
                    <div class="card-header">
                    <div class="card-body">
                        <img src="{{.ImgSrc}}" class="rounded float-right"/>
                        <p class="card-text">{{.Description}}</p>
                         <a href="{{.Link}}" target="_blank" class="btn btn-primary btn-sm">{{.Title}}</a>

The HTML code also includes references to Bootstrap a library to enhance the UI.

HTML page

Last updated on 25 Jun 2020
Published on 25 Jun 2020