Nodee story

Why we started with CMS

We worked on the e-commerce project for retailer of the sport goods, sport and casual clothes. First issue was to boost marketing. We want to create segmented and interactive campaigns. That means dozens of the landing pages and custom content widgets. Here started our NodeJS CMS. In that time we called it "editable".

Why we added e-commerce

Second problem was, how to get product's data to the campaigns. That means to have freedom to publish custom selection of the products anywhere. We had to solve, of course, how to manage orders from one place. On these requirements is based e-commerce platform.

Technologies

We had two requirements, when we looked for technologies. First need was the speed of development a the second one was performance. We made decision and choose for NodeJS.

Then we searched for some server-side framework. We studied more frameworks and decided to use TotalJS. The reasons was following. TotalJS has similar approach as we have. It is super fast for development, has exceptional performance. Other advantages are, that TotalJs is stable and easy scaling.

Other used technologies are AngularJS, MongoDB and Elastic for search.

CMS concept

We divided data / functionality from its view. That allowed us to create lightweight CMS. Nodee CMS is very easy to extend and components, we call them widgets, are reusable. We didn't leave behind users. CMS is easy to use for non-technical guys. At the end any CMS is made for content editors. We are happy with feedback, that editors can do and solve issues, which have to solve developer in other CMS.

Layouts

Layout is a html file with parts, which are displayed on every webpage. Such as logo, navigation, footer, etc. Rest of the page is rendered inside <renderbody></renderbody>. You can use one or more layouts.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta>
    <title>default.html</title>
    <css></css>
    ...
</head>
<body>

    <!-- Navigation -->
    <nav></nav>

    <!-- Body - use Pages, Partials ans Widgets to insert content -->
    <div class="body">
        <renderbody></renderbody>
    </div>

    <!-- Footer -->
    <footer></footer>
    <script></script>

</body>
</html>

Pages

Every website needs more pages e.g. home page, blogpost, content page etc. You choose what will be editable by content editor and where he can add more content (widgets). You add <div ne-container="center"></div> to enable to add widgets on the page. Let see empty page code example.

<layout template="layouts/default">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div ne-container="center"></div>
            </div>
        </div>
    </div>    
</layout>

Partials

Partials enhance website functionality. It can be some menus, pagination, breadcrumbs etc. Partials are parts on the webpage, which update often automatically. You just add partial's controller settings to set up its behaviour. To add partial on the webpage you need to add just one line of code.
<widget template="partials/sidemenu"></widget>
or
<widget template="partials/breadcrumbs"></widget>

Widgets

Widgets serve to add and edit webpage's content. The more different widgets you make the more freedom have content editors. See some examples: