{"id":824,"date":"2017-12-14T12:10:27","date_gmt":"2017-12-14T12:10:27","guid":{"rendered":"https:\/\/www.remotedevelopment.co.uk\/cms\/?p=824"},"modified":"2019-06-06T18:57:28","modified_gmt":"2019-06-06T18:57:28","slug":"spa-version","status":"publish","type":"post","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/spa-version\/","title":{"rendered":"SPA version"},"content":{"rendered":"

This site is based on a CMS, WordPress. It is not particularly “state of the art” as such. We can take this in one of these two directions:<\/p>\n

1. Make a parallax scrolling view (where a background scrolls at a different rate to the foreground) by changing the CSS to render the pages of this site.<\/p>\n

2. Create an SPA that uses the content of the CMS site and maintain the CMS as \/cms.<\/p>\n

The first is relatively easy. But what does it achieve? Nothing much, apart from how the site appears. There are some people who decry parallax views as pointless. I am not sure that I find it a compelling design choice. It is a bit like fins on a car – looks nice, but aerodynamics may be better served by their absence. Depends on the car, depends on the taste of the driver. So I think I will forget that (the theme does it anyway on the home page).<\/p>\n

Creating an SPA using VueJS or or Angular<\/del> Aurelia requires more parts. It is a challenge. What are these parts?<\/p>\n

1. Front end design
\n2. Front end components
\n3. wp api calls to populate components
\n4. keep the CMS working to create content.<\/p>\n

So let’s start!<\/p>\n

Requirement<\/p>\n

Render pages from this site<\/p>\n","protected":false},"excerpt":{"rendered":"

This site is based on a CMS, WordPress. It is not particularly “state of the art” as such. We can take this in one of these two directions: 1. Make a parallax scrolling view (where a background scrolls at a different rate to the foreground) by changing the CSS to render the pages of this … <\/p>\n

Continue reading “SPA version”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_newsletter_tier_id":0,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"categories":[45],"tags":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p8yghz-di","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":866,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/spa-version-of-remote-development\/","url_meta":{"origin":824,"position":0},"title":"SPA version of Remote Development","author":"Nicholas","date":"January 11, 2018","format":false,"excerpt":"The SPA version of Remote Development shall be the website that this CMS site augments. Its functions are to sell the concept of remote development as directly as possible and then to present three CTAs: Online Application Manage your own content Sell products and services online No complexity, no verbiage,\u2026","rel":"","context":"In "New articles"","block_context":{"text":"New articles","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/new-articles\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":610,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/being-a-service-centre-or-a-nerd-club\/","url_meta":{"origin":824,"position":1},"title":"Being a service centre or a nerd club?","author":"Nicholas","date":"September 24, 2017","format":false,"excerpt":"It is quite hard to map the direction when you create organically. But the two central themes of RD are: Service and Technical brilliance. Service Our services are more in touch with the client Our services are more flexible and agile It is not expensive to change your ideas It\u2026","rel":"","context":"In "Site Strategy"","block_context":{"text":"Site Strategy","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/technical\/site-strategy\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":352,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/site-reorganised\/","url_meta":{"origin":824,"position":2},"title":"Site reorganised","author":"Nicholas","date":"August 21, 2017","format":false,"excerpt":"We have reorganised the menus and links on this site to reflect our live site and how it functions. This is an Agile project, so some initial assumptions or pages that lacked clarity have been removed and menu and page structure clarified to make the site easier to use.","rel":"","context":"In "Article"","block_context":{"text":"Article","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/article\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":929,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/client-success\/","url_meta":{"origin":824,"position":3},"title":"Client Success","author":"Nicholas","date":"May 28, 2018","format":false,"excerpt":"www.SecretCabaret.co.uk is a new site for magician Simon Drake, developed on our Cloud Servers using PHP and HTML. Using the GTMetrix tool we achieved excellent site speed:","rel":"","context":"In "Article"","block_context":{"text":"Article","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/article\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-28-at-09.22.46.png?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":877,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/ssl-and-google\/","url_meta":{"origin":824,"position":4},"title":"SSL and Google","author":"Nicholas","date":"January 25, 2018","format":false,"excerpt":"Google's ranking algorithm requires that sites are SSL in order to clean up the web.\u00a0 If you need to have SSL activated, please let us know. Remote development sites CMS sites SSL is generally provided with SSL sites. Cloud Sites SSL is provided as an optional extra.\u00a0 It may increase\u2026","rel":"","context":"In "Article"","block_context":{"text":"Article","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/article\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":472,"url":"https:\/\/www.remotedevelopment.co.uk\/cms\/portfolio-site\/","url_meta":{"origin":824,"position":5},"title":"Site profile: Software Antelope","author":"Nicholas Alexander","date":"August 27, 2017","format":"gallery","excerpt":"Before Remote Development I created this interface using html, css, d3js, and boostrap for the company that owns Remote Development, Software Antelope Ltd. (I made the software and then was hired as an onsite contractor spending 25% over-time travelling to and from work). Remote Development is a new iteration of\u2026","rel":"","context":"In "Portfolio"","block_context":{"text":"Portfolio","link":"https:\/\/www.remotedevelopment.co.uk\/cms\/category\/portfolio\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.remotedevelopment.co.uk\/cms\/wp-content\/uploads\/2017\/08\/Screen-Shot-2017-08-27-at-13.32.53-300x214.png?resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/posts\/824"}],"collection":[{"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/comments?post=824"}],"version-history":[{"count":4,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/posts\/824\/revisions"}],"predecessor-version":[{"id":1093,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/posts\/824\/revisions\/1093"}],"wp:attachment":[{"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/media?parent=824"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/categories?post=824"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.remotedevelopment.co.uk\/cms\/wp-json\/wp\/v2\/tags?post=824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}