So I'm in the process of running through tutorials on AEM 6.1, and the tutorial is fine for telling me what to do, but it doesn't really do a very good job of explaining "why" I'm doing some of the stuff. I see that I have to setup parts of my web site in "apps", "design", "components" and "content" folders in CRXDE Lite, but I don't understand why there are 4 different interrelated configurations - and how they are related to each other.
Is there a document that best describes this relationship, and explains why it is setup that way?
This is the essence of AEM.
You create your application under /apps.
Under /apps - you can create a components folder. A component has a dialog,
Content- such as pages - is stored under /content.
See this white paper: Developing for Adobe® Experience Manager
See this 1st tutorial you should do as a new developer: How to Create a Fully Featured Internet Website (this explain AEM app concepts)
As you go through these topicss- ask more specific questions if you need to. For example - why do i need an OSGi service?
Here is the answer to your question:-
Normal website is a combination of few things working together in successful manner and those are :
1. JS/CSS - Which basically contribute towards UI and JS and which be stored in /etc/design/project
2. Application code: This includes you template (/apps/template), component (/apps/component), all java code(/apps/install), system configurations(/apps/config)
3. Page Now when you create page using template and component they will be stored in /content/project
An AEM instance can have more that one website as well, so this helps to structure everything.