X

The Digital Experience Platform blog covers the latest in innovative technologies to help you transform your business.

Build your JavaScript blog site using Oracle Content Management

Ankur Saxena
Principal Product Manager

If you are looking to bring in Blogs as part of your website checkout our simple Blog site sample implemented using JavaScript and jQuery techniques.

A high level overview of our Blog Site samples is available in my previous blog “Introducing a Blog Site sample in your favorite technology using Oracle Content and Experience as a Headless CMS”.

Using Oracle Content Management as a headless CMS enables developers to focus on the website development which only needs to be done once and then moving forward content contributors just focus on writing blogs with rich content.

This blog post explains how you can download the oce-javascript-blog-sample from GitHub and try it yourself. We have also created a detailed video to provide you with more information and internals on our JavaScript blog sample

Here is how the GitHub page looks like for oce-javascript-blog-sample

The first step is to clone the sample into your existing local directory folder and then change the directory to the one you have just cloned

username@user-dir ~/projects> git clone https://github.com/oracle/ oce-javascript-blog-sample

username@user-dir ~/projects> cd oce-javascript-blog-sample

username@user-dir ~/p/oce-javascript-blog-sample>

Before we proceed, make sure you install all the dependencies involved to run this project by running the npm install command.

username@user-dir ~/p/oce-javascript-blog-sample> npm install

Once you open the codebase that you have just cloned in your machine in a code editor, you will see the following directory structure (Atom code editor)

Go to src/config /oce.jason file and provide the serverUrl and channelToken. To let you try the sample quickly, there is a default server URL and channelToken in place to one of our live demos servers that you can choose to leave in place. When you are ready to try creating your own content you can replace with server URL to your own instance and provide token for your own channel.

Now, we just need to build this sample and then type npm run start command to run the sample

 

username@user-dir ~/p/oce-jet-blog-sample> npm run build

username@user-dir ~/p/oce-jet-blog-sample> npm run start

Now the sample will start running in a browser @ localhost:8000

The sample contains a list of blog topics and when we navigate into these topics, we can see a list of blog articles written on the respective topic. Furthermore, user can then tap on any of the blog tiles to read the full blog article.

All the content displayed by the sample is dynamic and is fetched at runtime from Oracle Content Management.

To dive deeper into how it works we have created a detailed video to provide you with more information on the internals of the code. You can also check out the tutorial, Build a Blog in JavaScript with Headless Oracle Content and Experience.

If you are interested in trying out more samples using various technologies, check out Oracle Content Management Samples page.

Before starting with the tutorials, if you have not set up an Oracle Content Management account yet, please have a look at our Quick Start Guide. To learn more about Oracle Content Management, you can read Overview of Oracle Content Management and if you are interested in headless development you will want to have a look at Oracle Content Management as a Headless CMS.

Conclusion

Developers can simplify the creation of Blog Sites using headless Oracle Content Management and can quickly build Blog Sites. Now, developers can easily download and try oce-javascript-blog-sample. They also can go through oce-javascript-blog-sample tutorial and learn how to fetch content from Oracle Content asset repository.

 

Be the first to comment

Comments ( 0 )
Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.