Brightside – TYPO3 web design & development agency

Open knowledge

Our first TYPO3 Neos project goes live

There's new CMS, it's called Neos and it's a kick ass editing and development experience.

Page in editing mode
Page in editing mode
Page in 500px break point preview mode
Page in 500px break point preview mode

I'd say the project itself started earlier this year as we switched our main hosting server to Nginx and optimized it for TYPO3 CMS and Neos only.

From TYPO3 CMS to TYPO3 Neos

As we constantly keep our clients pages up to date and security patched we need to update software behind the website. For this certain page it was time to move on from TYPO3 4.7 to somewhere.

Another decision was to go responsive, so we decided to leave the old html/css and code it from scratch. From that point I thought why not try Neos. Being a very simple site after all – Neos will do it, without extra coding.

Starting with no real experience

Surely it wasn't the first ever Neos install in our server but there wasn't real experience building page packages or what so ever.

Install done, new site package kickstarted it was time to hack away. Having the experience with TypoScript and Fluid templating is useful but not something you can't do without building your first page with Neos.

Simple to develop with

Whole process proved to be surprisingly straight forward. Looking at the file structure of whole thing was a bit scary at first but it all started to make sense in next few hours. Checking out the demo page package included, it was quite easy to understand the YAML configurations, how to extend and add new content types, build forms and send it's content with swiftmailer etc. There really was no real need to dig into the documentation.

Going responsive with Preview central

One of the pretty unique features of Neos is the Preview central. There you can set your page output in very different ways configuring the output template. As we had fully CSS based responsiveness on this newly coded page I wanted to try out the preview feature just to get the feel of it.

There was 3 breakpoints in the CSS so I thought there should be a preview for each one. Thinking "Iframe, iframe, iframe... no just CSS without media queries", loaded CSS files depending on the preview selected and setting the width of the outmost container. Simple as this: Default, Default + 900, Default + 900 + 780, Default + 900 + 780 + 500, and there you go, 4 previews to select from.

Very powerful feature and as you can imagine not just for the different screen sizes.

Next project?

Certainly! It will happen soon. There are still few very basic features to wait for and it would be nice to have a tiny bit more speed (static file cache or something to speed up tiny static pages like the given example), but no doubt it will come.

All in all, it didn't take much longer to develop a simple page on Neos using it for the first time than it would have taken with a framework I have had previous experience with.

I have had my doubts but it has been very positive experience and gives really optimistic feeling towards the TYPO3 community developments.

Extra thank you for everybody who have participated to deliver that innovative and so very usable CMS, TYPO3 Neos.

Use it :)

Check out the project page: