Panca Olah Institute Website

Launched on December 7, 2021

Panca Olah Institute Website

Overview 👀

A website to promote the services provided by Panca Olah Institute includes the development of human resources that focuses on character building, competence, and collaboration skills.

Objective 🎯

This website was created with the intention of serving as a platform for the promotion of the programs and courses run by Panca Olah Institute as well as to offer information related to the development of a holistic self.

Technologies Used 🧑‍💻

This website was created using JAM Stack technologies, which includes next.js, tailwind, and contentful as a Headless CMS.

The specifics of the library applied in this projects are as follows:

  • SWR for data fetching
  • Framer Motion for animations and transitions
  • Next SEO to make SEO management simpler
  • React Slick for carousel
  • Cusdis for the commenting feature

Features ✅

Content management

A very important feature on this website is content management. This website uses Contentful as content management because it has good performance and is easy to use.

Feature 1

Transition and animation

Transitions and animations on this website use Framer Motion and Tailwind CSS.

Feature 2
Feature 2-1

A website feature known as a carousel UI allows users to slide, fade, or otherwise bring information into view in a series of items. The carousel on this website is made with react-slick.

Feature 3

Pagination

To prevent performance from suffering due to an excessive content load, pagination is required.

Feature 4

Dynamic sitemap

A sitemap is necessary to keep a website relevant or related, particularly those with content in the form of blogs or news, since it is easier for visitors to discover the website.

Because this website uses server side rendering, a dynamic sitemap is needed to keep the sitemap up-to-date.

Feature 5

Results 🚀

The following are the results of the website that has been developed:

Home Page
Program Page
Program Detail Page
Course Page
Course Detail Page
Article Page
Article Detail Page
Article Detail Page

What I Learn 💪

In this project, I learned how to use contentful to manage the content of the website. I also learned how to handle pagination and how to use the SEO features of the website.