Building The Clone Of CoSchedule Website

Satwik Nayak
4 min readMar 16, 2021

Co schedule is an app used by marketing teams.Graphic designer, social media strategist.
Co schedule is a family of Agile Marketing products that will help you organize your content,social,work and assets in one place.
CoSchedule is going to help you spend less time on the unproductive parts of your job that you hate.
By co schedule we can reprioritize to handle the new tasks.

Group Members:

Khusboo Khator , Ashish Kumar Roul, Satwik Nayak & Sunil Kumar

(from Samurai 2)

The Design

We divided our to-do list into 3 categories depending upon skill set and strengths of our team members. Those were features of the original website that we

A)MUST HAVE:which would be our primary goal,ie Landing Page,Pricing Page,Login,Sign-up and Dashboard

B) SHOULD HAVE: All the animations and miscellaneous pages.

C)NOT HAVE: Many unnecessary pages linked to the main website.

Project Walkthrough

Landing Page:-

index page
Pop Up advertisement modals

This is the landing page where users enter the website. It has navbar for navigating to other pages. The front page has some cool animations and after 15 seconds of each refresh we get pop up advertisement modals.

Signup Page:-

SignUp page

We create our account by filling in the required fields in the signup page and clicking on the “Get Started Now ” button. This is data gets stored in local storage.

Login Page:-

As soon as we fill our email address and password in their respective fields , it tallies the data with data stored in the local storage and completes the login process.

Pricing Page:-

In pricing page we get to know about different account types and payment policies. We get to choose as per our preferences.

Demo Page:-

In demo page we can schedule a discovery call according to our convenient month,date and time.As evident from the screenshot.

Once we confirm our date and time we are redirected to our slot , where we have to fill in required details. On the left hand side we find the exact date and time we have opted for.

After filling the details and clicking on “Schedule event” button, we get the following message.

Dashboard:-

After signing up and logging in, we are directed to our account dashboard , where we can find our details , which are fetched from local storage and here we can schedule and plan our event.

Tech Stack Used

HTML , CSS , JavaScript

Libraries Used :- Font Awesome , AnimateCSS , GoogleFonts, Gstatic

Tools and Extensions used :- Font Finder, Color Picker

Collaboration:-GitHub

Overview:-

All in all the task of cloning the co-schedule website was exciting. It as some really cool features which we were excited to implement and learn . And the team played a massive role in helping me achieve my task . We divided our tasks and set daily and periodic goals. We would meet, discuss and find solutions to problems we faced during it.It was a wonderful learning experience. Being a part of a team of motivated individuals brings the best out from us.

The Challenges:-

The first hurdle was to overcome the communication problem, to gel with the team we had a off topic meeting after the work division just to know each other better personally, it helps in knowing each others strengths and weaknesses better.

There was a lot of functionalities which required a storage component .And local storage is the only resource we have, and it has many limitations.

Conclusion:-

During the course of project building, we develop not only as a coder but also as a coordinator,moderator and problem solver. Problem solving includes deep analytical and communication skills , which can be gained through experience and construct week gives us a perfect platform to experience .

Concluding my blog I would like to give a shout out to my teammates and mentors whose tireless effort and camaraderie made us see through the construct week and coming out with more confidence with this experience.

--

--