Site Architecture

Site Architecture

Pages

Home page

Purpose: current home page that will be the landing page at site launch

Path: src/pages/Home

Structure:

• index.js is the parent file that contains its own style section and Home, MarketingSection, and CallToAction components
• sections subdirectory contains NotableUsersSection.js and TrendingTopicsSection.js components
• There is a notableUsers list that is defined in NotableUsersSection.js that contains info for CTI contributor orgs
• index.js imports NotableUsersSection and TrendingTopicsSection. It also imports GetStartedCard from src/components
• Home component contains all of the home page and displays the following components from top to bottom: MarketingSection, CallToActionSection, NotableUsersSection, TrendingTopicsSection, GetStartedCard

How to Add Your Project

Purpose: It shows the steps how to add topic tags to your project.

Path: src/pages/HowToAdd

Structure:

• HowToAdd component in the main file index.js, which contains its own style section and ImageComponent component, SettingsGearIcon component.
• ImageComponent component in src/components uses CardMedia Material UI component for displaying the images.
• SettingGearIcon component in src/components uses svg which is used to define vector-based-graphics and path is an element in svg library which defines a path that starts from a position and ends to a particular position. The path element uses attribute d which uses M which is used for moving a point to a certain location.

About page

Purpose: provides information on the organization's project

Path: src/pages/about

Structure:

• index.js is the parent file containing formatting and an object for mapping the images of the page
• A Grid component contains an iframe slideshow explaining various aspects of the project
• styles.js contains the styling for the page