Challenge Overview
Challenge Objectives
-
Create a new "blogPost" component that will render posts in a blog.
Project Background
Community App is the new member-facing frontend of Topcoder platform. We integrate Contentful CMS into it to ease the process of content creation/update. Multiple sub-sites use the concept.
Technology Stack
Community App is ReactJS web application build with ExpressJS / NodeJS / JavaScript.
Code access
Community App code is available from its public GitHub repository. For this challenge, you will work out of the latest commit from new-develop branch.
Introduction
We have a basic starter guide related to the topic here. It describes how to setup a developer environment and what is “Good Contentful Component”. There is related sub-document “ContentfulLoader” that describes mechanics driving the Contentful Components. Please start by reading those.
Updated Topcoder's Contentful types: Please use this export of Contentful space. It contains the models for the new component already defined.
Requirements
-
Blog Post component (major)
Implement new component in Contentful folder called “BlogPost” following the code style and practices used by the existing components.
It should support themes like for instance ContentBlock does. Actually, blogPost is very similar to contentBlock but with some additional capabilities. Therefore it can be used as a starting point.
Model is available in the space config file referenced above.
Implement default theme same as ContentBlock does. It should lay out the hero image to the left then put title and description below it at the right of the image. Image should have 6px border-radius. There should be “PrimaryButton” component at the bottom with text “Read More”. The url of the button should be controllable via a component property.
-
Update Viewport (major)
Viewport component should be updated to support the new component.
-
Demo the new Menu component (major)
Create stand-alone demo, mounted on examples/contentful/blogpost/{COMPONENT_ID}
and linked from the app's content page, same as it is done for existing components in Contentful. Enable use the `preview` flag.
Use it to show a working version of the component for verification.
Final Submission Guidelines
Submit a Git patch for Community App against the commit mentioned earlier.
Submit deployment guide and verification document as two separate documents.
Include your `CDN_API_KEY` and `SPACE_ID` and `PREVIEW_API_KEY` keys so reviewers can test your submission when running against your Contentful space.