title: Fileserver directory for dynamic route
body: <p><strong>My scenario</strong></p>
  <p>Compiled angular projects are saved like</p>
  <pre><code>.
  ├── branch1
  │   ├── commitC
  │   │   ├── app1
  │   │   │   ├── index.html
  │   │   │   └── stylesheet.css
  │   └── commitD
  │       ├── app1
  │       │   ├── index.html
  │       │   └── stylesheet.css
  │       └── app2
  │           ├── index.html
  │           └── stylesheet.css
  ├── branch2
  │   ├── commitE
  │      ├── app1
  │      │   ├── index.html
  │      │   └── stylesheet.css
  │      └── app2
  │          ├── index.html
  │          └── stylesheet.css
  └── master
      ├── commitA
      │   ├── app1
      │   │   ├── index.html
      │   │   └── stylesheet.css
      └── commitB
          ├── app1
              ├── index.html
              └── stylesheet.css
  
  </code></pre>
  <p><strong>Database</strong></p>
  <pre><code>TABLE data(id , branch, commit)
  </code></pre>
  <p>Entries: e.g.</p>
  <div class="s-table-container">
  <table class="s-table">
  <thead>
  <tr>
  <th style="text-align: left;">id</th>
  <th style="text-align: center;">branch</th>
  <th style="text-align: center;">commit</th>
  </tr>
  </thead>
  <tbody>
  <tr>
  <td style="text-align: left;">abc</td>
  <td style="text-align: center;">branch1</td>
  <td style="text-align: center;">commitC</td>
  </tr>
  <tr>
  <td style="text-align: left;">def</td>
  <td style="text-align: center;">branch1</td>
  <td style="text-align: center;">commitD</td>
  </tr>
  <tr>
  <td style="text-align: left;">ghi</td>
  <td style="text-align: center;">master</td>
  <td style="text-align: center;">commitA</td>
  </tr>
  </tbody>
  </table>
  </div>
  <p><strong>Now I want to access</strong></p>
  <p>:8080/apps/{id}</p>
  <p>e.g.: localhost:8080/apps/<strong>abc</strong></p>
  <p>the path should will be generated after requesting the DB entry</p>
  <p>and a fileserver serves the directory
  ./files/<strong>branch1</strong>/<strong>commitC</strong>/</p>
  <p>now i would expect to see the folders app1 and app2</p>
  <p><strong>What I have</strong></p>
  <pre class="lang-golang prettyprint-override"><code>func main() {
      mux = mux.NewRouter()
      mux.HandleFunc(&quot;/apps/{id}/{app}&quot;, s.serveApp).Methods(&quot;GET&quot;)
  }
  
  func (s *Server) serveApp(w http.ResponseWriter, r *http.Request) {
      params := mux.Vars(r)
  
      app := params[&quot;app&quot;]
      id := params[&quot;id&quot;]
  
      entry, err := getFromDB(id)
      if err != nil {
          w.Header().Set(&quot;Content-Type&quot;, &quot;text/html&quot;)
          respondWithError(w, http.StatusInternalServerError, err.Error())
          return
      }
  
      file := filepath.Join(DefaultFolder, entry.Branch, entry.Commit, app, &quot;index.html&quot;)
  
      fmt.Printf(&quot;redirecting to %s&quot;, file)
      http.ServeFile(w, r, file)
  }
  </code></pre>
  <p>how can I serve the whole directory like that, so all css and js files can be accessed correctly?</p>
  <p>I think I need something like this</p>
  <pre class="lang-golang prettyprint-override"><code>http.Handle(&quot;/tmpfiles/&quot;, http.StripPrefix(&quot;/tmpfiles/&quot;, http.FileServer(http.Dir(&quot;/tmp&quot;))))
  </code></pre>
  <p>but how can a access mux.Vars(request) to build up the directory path?</p>
  <p><strong>############</strong>
  <strong>Regarding CSS serving problem</strong></p>
  <pre class="lang-golang prettyprint-override"><code>import (
      &quot;log&quot;
      &quot;net/http&quot;
  
      &quot;github.com/gorilla/mux&quot;
  )
  
  func main() {
  
      mux := mux.NewRouter()
  
      fs := http.FileServer(http.Dir(&quot;static&quot;))
      mux.Handle(&quot;/&quot;, fs)
  
      log.Println(&quot;Listening...&quot;)
      http.ListenAndServe(&quot;:3000&quot;, mux)
  }
  </code></pre>
  <p>CSS files are served as 'text/plain'</p>
  <p><strong>Files:</strong></p>
  <ul>
  <li>main.go</li>
  <li>static/
  <ul>
  <li>index.html</li>
  <li>main.css</li>
  </ul>
  </li>
  </ul>
  <p>index.html</p>
  <pre class="lang-html prettyprint-override"><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;meta charset=&quot;utf-8&quot;&gt;
    &lt;title&gt;A static page&lt;/title&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;main.css&quot;&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;h1&gt;Hello from a static page&lt;/h1&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>main.css</p>
  <pre class="lang-css prettyprint-override"><code>body {color: #c0392b}
  </code></pre>