diff --git a/apps/dotcom/src/app/App.tsx b/apps/dotcom/src/app/App.tsx
index bef465f..c1e96e8 100644
--- a/apps/dotcom/src/app/App.tsx
+++ b/apps/dotcom/src/app/App.tsx
@@ -10,6 +10,7 @@ import ApplyDeveloper from './pages/apply/developer/ApplyDeveloper';
import ApplyProductDesigner from './pages/apply/product-designer/ApplyProductDesigner';
import ApplyProductManager from './pages/apply/product-manager/ApplyProductManager';
import Events from './pages/events/Events';
+import FAQ from './pages/faq/FAQ';
import Home from './pages/home/Home';
import NotFound from './pages/notfound/NotFound';
import People from './pages/people/People';
@@ -43,6 +44,7 @@ const App: React.FC = () => {
+ {/* */}
diff --git a/apps/dotcom/src/app/pages/faq/Accordion.tsx b/apps/dotcom/src/app/pages/faq/Accordion.tsx
new file mode 100644
index 0000000..a1b633f
--- /dev/null
+++ b/apps/dotcom/src/app/pages/faq/Accordion.tsx
@@ -0,0 +1,66 @@
+// Mostly copied from src/app/components/Accordion.tsx
+
+import React, { useState } from 'react';
+import {
+ Accordion as MuiAccordion,
+ AccordionDetails,
+ AccordionSummary,
+ Typography,
+ Fade,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
+import { makeStyles } from '@material-ui/core/styles';
+
+interface AccordionProps {
+ sections: any[];
+}
+
+const useStyles = makeStyles({
+ title: {
+ fontWeight: 500,
+ },
+});
+
+const Accordion: React.FC = (props: any) => {
+ const classes = useStyles();
+ const [showHiddenQuestions, setShowHiddenQuestions] = useState(false);
+
+ return (
+ <>
+ {props.sections.map((section: any, index: any) => (
+
+
+ }
+ onClick={() => {
+ console.log('onClick called');
+ setShowHiddenQuestions(true);
+ }}
+ id="panel1a-header"
+ >
+
+ {section.title}
+
+
+
+ {section.body}
+
+
+
+ ))}
+ {showHiddenQuestions && (
+
+ {props.hiddenQuestions.map((question: string) => (
+ <>{question}
+ ))}
+
+ )}
+
+ );
+};
+
+export default Accordion;
diff --git a/apps/dotcom/src/app/pages/faq/FAQ.tsx b/apps/dotcom/src/app/pages/faq/FAQ.tsx
new file mode 100644
index 0000000..c8d69e1
--- /dev/null
+++ b/apps/dotcom/src/app/pages/faq/FAQ.tsx
@@ -0,0 +1,72 @@
+import React, {
+ useCallback,
+ useEffect,
+ useImperativeHandle,
+ useMemo,
+} from 'react';
+import { Helmet } from 'react-helmet';
+import { Container, Box, Link } from '@material-ui/core';
+import Hero from '../../components/Hero';
+import { ReactComponent as SVG } from './faq.svg';
+import { Link as RouterLink } from 'react-router-dom';
+import Accordion from './Accordion';
+
+export default function FAQ() {
+ // this is the list of FAQs
+ const frequently_asked_questions = [
+ {
+ title: 'What does C4C stand for?',
+ body: 'C4C stands for Code4Community!',
+ },
+ {
+ title: 'How does the application process work?',
+ // TODO figure out how to link to the apply page from here
+ body: "Visit the apply page and submit your application. We'll reach out to schedule an interview with 1-2 members of our team.",
+ },
+ {
+ title: 'Who do we work with?',
+ body: 'We work with nonprofits in the Greater Boston area that strive to improve the community we live in. We look for organizations that have a need for a software solution, but lack the resources to pursue typical development channels.',
+ },
+ {
+ title: 'How often does C4C meet?',
+ body: 'Product team members meet once a week.',
+ },
+ {
+ title: 'What is the product team structure?',
+ body: 'Teams are structured around a single project that everyone works on together. Each team is made up of: a project lead, 1-2 designers, and several software developers.',
+ },
+ {
+ title:
+ 'How many people are in C4C? How many people are on a product team?',
+ body: 'Depending on how many partners and projects we are taking on in a semester, our organization size may vary. However, our product teams are usually around 8 members each.',
+ },
+ {
+ title: 'What have you worked on in the past?',
+ body: (
+ <>
+ Check out our past projects on our{' '}
+ Github!
+
+ ),
+ },
+ ];
+
+ useEffect(() => {
+ window.scrollTo(0, 0);
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/apps/dotcom/src/app/pages/faq/faq.svg b/apps/dotcom/src/app/pages/faq/faq.svg
new file mode 100644
index 0000000..ed5f21e
--- /dev/null
+++ b/apps/dotcom/src/app/pages/faq/faq.svg
@@ -0,0 +1 @@
+
\ No newline at end of file