How should I structure a SPA with Go?

<p>Hi Everyone!</p> <p>I&#39;m new to Go, so please bare with me.</p> <p>My Go project is serving up a relatively static website using templates and (soon) a SPA, how should I deal with the directory structure? This is what I currently have.</p> <pre><code>-Go Project --database (some DB stuff) --handlers --models --sass --static --css --img --js --templates (Golang templates for the website) --pages --partials </code></pre> <p>Now I want to add a Vue SPA to this project, but I&#39;m not sure where to place the files. Should I place the vue project n the static/js folder, or perhaps create a whole new directory just for it? </p> <p>Should I restructure the whole application into a client/server structure? What about the Go templates, that would have to remain in the server directory?</p> <p>Any recommended practices I should be aware of?</p> <hr/>**评论：**<br/><br/>bear1728: <pre><p>I&#39;m not sure what is recommended, but I am working on a medium-sized SPA (using React/Typescript/etc) with a go backend. In our case, the only connection between the frontend and backend is through a REST-like api, they live in entirely separate repos. This has some pros/cons. Any update to the api has to be consistent across both repos. Our api has settled down for the most part, so this doesn&#39;t come up for us. A pro is that you can work on either end independently, and even mock the other side very easily. For example, I use curl or <a href="https://github.com/Huachao/vscode-restclient" rel="nofollow">this extension</a> to test the backend, and I wrote a simple js file which mocks the backend (returning some random-ish data). I think separating the concerns this way can be helpful in environments with more than one developer.</p> <p>In your situations, because you have templates, this may not be as simple. But unless you&#39;re going to try and use <a href="https://github.com/gopherjs/gopherjs" rel="nofollow">gopherjs</a> to write the frontend in Go, you may consider making it a whole new directory and following best practices for Vue in that directory.</p></pre>scottjbarr: <pre><p>I suggest splitting the frontend and backend. Keep them in seperate repos. </p> <p>Build your backend in Go and expose an API.</p> <p>The frontend can be built in anything you like (Vue, React, Angular, etc), and use any structure you want to use.</p> <p>Now your frontend isn&#39;t tangled up with your backend. </p> <p>You could deploy a backend on GAE, and a frontend via Cloudfront with free SSL.</p></pre>benbjohnson: <pre><p>I agree with splitting backend &amp; frontend. If you want to keep both in sync you could have a single monorepo and simply have a subdirectory for each application:</p> <pre><code>myapp/ myapp-api/ myapp-web/ </code></pre> <p>Also, as an alternative to SPA you could also look at using Turbolinks. It provides a lot of the speed boost of SPA without the cognitive overhead of React/Vue.</p></pre>jgillich: <pre><p>I usually put the SPA in <code>/app</code>, but it doesn&#39;t really matter; they could be in seperate repos as well if you prefer that.</p> <p>You generally don&#39;t want server side templates in a SPA because they hurt performance. Fetch data via a REST API and render everything on the client.</p></pre>manueslapera: <pre><p>SPA means <strong>Single Page Application</strong>, that is a page that loads once, then reloads the data via ajax calls.</p> <p>For the lazy</p></pre>bigbootyhoes9: <pre><p>If you are using VueJS, you can avoid &#34;templates&#34; (assuming youre talking about Go&#39;s html/templates).</p> <p>Just put an index.html file in your /static folder, have your JS code in that index.html file and do the routing/page views on the client side</p> <p>Have your go code just be server API calls</p></pre>