adobe / theblog

Apache License 2.0
7 stars 14 forks source link

Question on front-end code availabilty from theblog.adobe.com #154

Closed romellem closed 4 years ago

romellem commented 4 years ago

Hello!

I recently was looking at theblog.adobe.com and was impressed with the front-end work for some of the components on the page, namely the main navigation.

main-nav

I was curious to see how this was built, and so was looking at bit at the HTML structure, CSS, and JS for it.

Of course, that only takes me so far in understanding the tech underlying that component. Being able to look at non-minified source files with comments is much more useful, and so wondered if any of this work was open sourced.

After a quick google search, I found this repository.

I see that this is a work-in-progress port of the current site, and so not all components exist in this repo (yet?).

I am curious:

Just looking for some more information. If you'd prefer to take this discussion off Github Issues, I'd be happy to communicate elsewhere.

Thanks!

auniverseaway commented 4 years ago

Hi @romellem! Thanks for the compliments. I'm an engineering manager for adobe.com and have worked a touch on the port of theblog.adobe.com. I'll trying and answer your questions.

The Blog UX and code was done by an outside agency with heavy oversight by our own internal design studio. Interestingly, this port you see is an effort to bring theblog.adobe.com internal on some newer technologies than Wordpress.

Unfortunately, even we do not have access to the current un-minified code since it was built and currently maintained by an external agency.

As part of the port to Helix (an open source tool for creating and hosting content) we will be changing the global navigation that your gif represents.

There's no current plans to un-open source the code you see here, but I'm not sure it will provide a ton of value. Even as we start working on the new UX that will be shipping eventually with this port. The way I look at it is like, "If I read all the source code of iOS, would I know why an iPhone is so delightful?" So much of what "feels" good is just testing and iterating.

My suggestion would be to do explorations in CSS transitions / transforms / keyframes, JS event triggers to toggle classes that enable those, and go from there. We have also have an open source project you can check out at: http://github.com/adobe/adobe-dx where we'll be open sourcing even more of adobe.com. It's primarily work targeted for AEM (Adobe Experience Manager), but there will be plenty of platform agnostic JS / CSS if you're curious how we build our sites.

Good luck and let me know if you have any other questions!

romellem commented 4 years ago

Makes sense, thanks for the response and information!