#Getting Started
There are two ways to read this documentation. Now that you know how MercuryCMS works from a overview level, you can either read through each of the features in the Features section or jump right in and make an example website from scratch.
Before you do that, there are a few things you should know.
#Design Process
MercuryCMS is built for professionals, but you don't need to know everything about the web to use it. The CMS is made for designers, developers, and content-writers to be able to work together in their areas of expertise.
The typical design process for a website is as follows:
- The designer builds the page markup, layouts, style, and simple Components such as header, footer, and buttons.
- The developer can help with any Components requiring JavaScript, reactivity, or API calls.
- The designer creates any Collections they need to store things like the Business' hours, Theme colors, Nav Links, or Gallery Photos.
- The developer can help add more complex Collection fields like automatically generating a Blog Post's slug based on its title, or data modeling like linking Blog Posts to Authors.
- The developer can also add complex functionality to Collections like writing functions to get recent or related Blog Posts that the designer can use on Pages.
- The developer can also help with creating dynamic routes such as one page for each Blog Post.
- Once the website is built, the designer and developer can move on to other projects and only content writers are needed to add more Blog Posts and Authors, upload new Gallery Photos, or update the Business' hours.
This is the process for developing a website completely from scratch. Once a few websites have been built in MercuryCMS, you can export any Components or Collections you want to reuse on other sites. This means you can begin making sites with little to no help from the developer.
#Languages
MercuryCMS is built using modern standards and common formats. Standard HTML, CSS, and JavaScript are all you need to build great websites, but to get the full power of MercuryCMS Templating, you should learn Pug and Stylus.
You don't need to learn everything about them, just the basic syntax as all of the documentation and examples assume you will be writing in these languages. Don't worry, if you understand HTML and CSS at all, you can start using Pug and Stylus right away with no problems.
If you're a content writer, you should learn Markdown as all Rich Text fields are formatted and stored using it.
If you're a developer, or a designer that wants to be able to make and maintain your own more interactive Components, you should learn Vue. The build-time functions you can add to Components and Pages are run in a Node.js context.
#Text Cases
Much of MercuryCMS's functionality relies on automatically converting between different text cases. Here are some examples:
- HTML tags are kebab-case. This means a Component called "Site Header" will be used on a Page as
<site-header></site-header>. - Component attributes are also kebab-case within Pages, meaning if you have a Component called "Hero Image" and it has an attribute called "Media ID", it will look like this on the page:
<hero-image media-id="62649b8c56f8b6186cd7d9cf"></hero-image>. - Component attributes within code will be in camelCase. So if you're within the Component's markup and you want to access the "No Border" attribute, you would write something like
if (attr.noBorder). - Collection names and their fields used in code are also in camelCase. For example, a "Blog Post" Collection with a field called "Featured Image" would be accessed via
blogPost.featuredImage.
#Start Small
MercuryCMS gives you a lot of power and control. Most static site generators are very rigid and optimized for a single use. You may get a website that performs extremely well, but if you stray outside of what the template intended, things quickly break or become slow.
Instead, with this system, you have complete control over how every Page looks, how every Component functions, and can model the Collections to make any kind of website you want.
Start small by making some basic web pages and then branch out into the more advanced functionality once you need it. Follow along with the examples and then build from there. The documentation takes a "teach a person to fish" mentality so you can truly understand how MercuryCMS works, answer your own questions, and be able to grow and be creative going forward.
Good luck!