This blog post is a continuation of my talk at the Sitecore user group hosted in Kagool’s Manchester office.

Sitecore Knowledge

This is the second part of a three-part series covering the importance of Sitecore knowledge and how front-end developers can benefit from understanding what Sitecore is about, especially if you’re a Sitecore partner.

Common Issues

Over the years working with Sitecore I’ve witnessed some good and not so good front-end implementations in terms of Sitecore best practice. These are some of the more common issues I see / hear often.

Why Should I Learn / Understand Sitecore?

This is something I hear from front-end developers who have no experience of knowledge of Sitecore. I can understand why front-end developers may not have an interest in learning Sitecore especially if the company you work for uses lots of different CMS’s. This would add a tremendous amount learning on top of a quickly evolving front-end technology stack.

I believe that front-end developers who work with multi CMS’s should understand the platform they’re working with. I’ve worked with many CMS platforms such as Joomla, WordPress, Alterian CMC and ACM, Umbraco, however my primary focus is Sitecore.

I’ve found that having some knowledge of Sitecore has helped me reason about a problem differently and structure my front-end code into modules due to the component based architecture that Sitecore is best known for.

You can find out more about breaking your front-end code into modules from a earlier blog post Sitecore Frontend Approach – Quick Start Guide.

Not Building For Experience Editor

Without knowledge of Sitecore Experience Editor, a front-end developer will have difficulty trying to:-

  • Build content editor friendly components.
  • Know when to disable JavaScript functionality. For example, preventing a carousel from changing between slides when the editor is trying to change content.
  • Modify a component’s layout to better suite the needs of the content editor.
  • Build interchangeable components using compatible renderings.

Components can be placed anywhere

Sitecore has a great deal of flexibility which allows content editors to build a page from a suite of components made available to them. Content editors can change the order of components, move them to an entirely new place on the page or remove them completely.

With this amount of freedom comes a level of complexity to the front-end development process. If you work in your own front-end environment isolated from Sitecore it will become difficult to build, test and meet the requirements of a Sitecore component.

This is why in part one “Working in Sitecore as a front-end developer” I mentioned that the front-end team at Kagool work in the same environment as the back-end developers with Sitecore set up for locally.

Knowing that some front-end developers may not want to change their workflow to adapt for working with Sitecore makes me feel a little like this…

You make me sad gif

Sitecore Front-end Best Practices

As I mentioned in part one, the front-end developers at Kagool get their hands dirty with Sitecore and take ownership of the presentation layer.

These are some of the tasks we carry out in Sitecore as part of our front-end build process:-

  • Configure placeholder settings to manage which components are allowed to be placed in what location of a layout, allowing front-end developers to fully test combinations of components being added to a page.
  • Assign datasource location and datasource templates.
  • Add thumbnails to renderings and sublayouts to enhance the user experience and provide a quick component reference for new developers joining a project team.
  • Add custom experience editor buttons when required.
  • Determine which components should have compatible renderings.

The list above I believe should be owned by the front-end developers as all items relate to the things you see, which ultimately is the front-end developer’s realm.

Summary

If you’re a front-end developer working or looking to work for a Sitecore partner, it’s definitely worth spending some time learning the fundamentals of Sitecore. You’ll benefit greatly from gaining an understanding of:-

  • Experience Editor.
  • Configuring placeholder settings.
  • Custom Experience Editor buttons.
  • Datasource location and datasource templates.
  • Compatible renderings.

Having knowledge of just one or two of the above points will help front-end developers build better optimised code for Sitecore projects.

Whats next?

Hopefully this second post in the series has given you a few key areas you should check out if you’re a front-end developer new to Sitecore.

I hope you enjoyed reading this blog post and have found value in some of the things I’ve talked about so far. Thanks for reading and happy coding.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s