# Want to make something kindof SPA with Jekyll (to use Github Pages)

**URL:** <https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026>\
**Category:** Help\
**Created:** [August 5, 2018, 2:07am UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026 "2018-08-05T02:07:18Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![animanoir](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/animanoir/32/667_2.png) [@animanoir](https://talk.jekyllrb.com/u/animanoir)\
**Post date:** [August 5, 2018, 2:07am UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/1 "2018-08-05T02:07:18Z")

</div>

So I want to redesign my site to be like those flashy, flowing organic sites that _load everything in a single page_ with _cool animations and all that_.

How hard would that be? I mean, making a SPA is maybe out of my scope right now, at least could I simulate it with transitions and all that stuff?

I’m talking like sites that are on awwwards, that all flow smoothly and change the url and stuff.

What should I know/use to make it possible?

---

<div class="post-metadata">

**Author:** ![yashumittal](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/yashumittal/32/1260_2.png) [@yashumittal](https://talk.jekyllrb.com/u/yashumittal)\
**Post date:** [August 5, 2018, 8:16am UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/2 "2018-08-05T08:16:04Z")

</div>

So, what’s your question actually? Is it regarding Jekyll SPA or animation?

---

<div class="post-metadata">

**Author:** ![animanoir](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/animanoir/32/667_2.png) [@animanoir](https://talk.jekyllrb.com/u/animanoir)\
**Post date:** [August 5, 2018, 5:00pm UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/3 "2018-08-05T17:00:04Z")

</div>

What technology or philosophy should I apply to make my webpage looks as if it was a SPA, is that even possible on Jekyll via Github Pages?

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [August 5, 2018, 7:55pm UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/4 "2018-08-05T19:55:05Z")

</div>

Jekyll is just a generator - you put stuff in and it spits stuff out. Isn’t a SPA really just JS? you can use Jekyll to output Json quite easily, and then use JS to parse that however you wish. So you could do all your posts in markdown, then run that thru a layout/page that creates json file of all your posts, and then use JS to display it.

Something like gatsby may be more efficient though.

google `jekyll single page template` and you’ll get lots of results. Not quite sure this is what you mean though.

---

<div class="post-metadata">

**Author:** ![yashumittal](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/yashumittal/32/1260_2.png) [@yashumittal](https://talk.jekyllrb.com/u/yashumittal)\
**Post date:** [August 6, 2018, 5:49am UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/5 "2018-08-06T05:49:12Z")

</div>

# Technology

Try using Gatsby or Nuxt for SPA and PWA.

---

<div class="post-metadata">

**Author:** ![tshelver](https://avatars.discourse-cdn.com/v4/letter/t/eb9ed0/32.png) [@tshelver](https://talk.jekyllrb.com/u/tshelver)\
**Post date:** [March 30, 2019, 1:00pm UTC](https://talk.jekyllrb.com/t/want-to-make-something-kindof-spa-with-jekyll-to-use-github-pages/2026/6 "2019-03-30T13:00:53Z")

</div>

Nuxt or Next more so than Gatsby.

By definition, a static site can’t be SPA. But it might be much faster 🙂

I suppose you could use Jekyll to generate the basic HTML framework, and then use javascript to pull in the relevant content as the user navigates through the system, but that is why front-end frameworks were invented, and why tools like Next and Nuxt are focused on server-side rendering of the initial page, and then pre-rendering the succeeding ‘pages’, to speed up response.
