Recently SXA is getting much more popular in Sitecore development world. It's a natural way, because it brings many features and improvements which can help and mainly speed up process of creation site in Sitecore.
Usage SXA is also connected with changing workflow between particular parts of your team. Backend guys have to be aware of new tenants, themes, components, modules and other features which SXA provides.
Frontend guys have to be aware of new HTML structure which by default brings SXA components for them. So they can focus only on styling elements on the page (Of course we can have custom things as well).
Hence, we see that now frontend part has to get in someway elements prepared by backend to style them. To do that SXA provides a default mechanism called "Creative Exchange" with the last version "Live".
What is it?
1. Default Creative Exchange approach:
In standard approach backend developer build site structure using components, but it doesn't have to be styled yet. After his job is done he export special package using Creative Exchange exporter for frontend guys.
They get this package where are *.sass and *.css styles files, HTML of components etc. They can now style components using mainly sass. After their work, they zip package once again and backend developer is importing this to the Sitecore, where Themes are updated with new styles.
It sounds really cool, but recently it has been even improved by the newest version "Creative Exchange Live" which work in real-time.
It enables developers to modify themes and other site content without having to import the files back into the site. Creative Exchange Live works with Gulp tasks that enable you to make changes to themes and other content and synchronize to the Sitecore environment immediately.
It seems to be even better as I wrote, because we don't have to generate any packages.
But we still we have a few obstacles in the team which we can appear:
1. Whenever you have worked already with Creative Exchange or you haven't but you would like to try, potentially there is a risk to keep your friendship with frontend guys: You will ask why? Usually frontend guys love to build magic with the newest frontend technologies, which everyone knows how fast are changing. So creating CSS or sass for them is a bit obsolete.
2. If we use the older version (not "Live") we have to have this whole generating package process which can be inconvenient for people in the team
3. If we choose "Live" version everything work but in one scope of work, like one developer environment. It means it would be good if developer will be a full stack who will have a content and later will style that or it brings a need to install Sitecore, especially for frontend guys to let them use this real-time styling.
2. Our Custom Creative Exchange
Every path for above has some constraints. Because of that for our teamwork we prepared something new and special. Which will combine advantages of Live version but without need to install Sitecore on frontend guys environments, no generating packages etc. Let's take a look:
What we can see at first look is that comparing to default Creative Exchange, point of merging content and styles is moved to right side. It means that no more Sitecore is responsible for that, hence Sitecore is not needed for this and for frontend developers. Since now responsibilities connected with merging takes Apache server which was setup especially for that.
But how? from where it takes content?
Let's go through this flow:
- Setup backend devs and frontend devs in one network
- Frontend developer setup on his/her machine Vagrant environment which consists Apach server responsible for merging content with styles and whole frontend environment
- Backend developer does backend work, he prepared page with components on the page
- Frontend developer put in Apache config file IP of backend developer to whom wants to connect
- During making request to particular page from backend developer (where content has been created) Apache is filtering traffic according to predefined rules.
- If there is no connection to styles it brings content from particular machine which IP was used (backend guys for our example)
- If it's connected with styles, traffic is redirected to own frontend developer resources to get content from his/her styles files.
So now I think that everything is clear.
Apache analyzes traffic send from frontend developer and decides from which source it has to get. If it's content case, it gets from an external machine, but if it connected with styling it redirects traffic and gets source from frontend machine.
It means that we:
- don't have to use packages
- don't have to install Sitecore for frontend guys
- have separated environments but still real-time connection between content and styles for frontends
That's it! :)
Below I put config for virtual hosts in Apache
Cheers!
No comments:
Post a Comment