# Zinc internal ideas platform <!-- Put the link to this slide here so people can follow --> slide: https://hackmd.io/jNhN7oasSBCVxA-GL2r3nA?both --- ## Jack Bridger - B2B sales & ops -> Full Stack Developer - Founder of Code at Uni - Worked at 2 startups - Available on Shutterstock.com  --- ### The problem "To build an internal platform for Zinc founders to share their business ideas, joining in discussion with other founders to develop ideas further" --- ## Finding founders and ideas under time constraints is hard --- ### Epic User Journey  --- ### Basic components * Login page * Portfolio of projects Page * Input business idea Page * Idea Main Page (output business idea) --- # A LOT to do in 3 hours --- ### User stories to focus on * 'Sign in' with email * View ideas summary (including who submitted it) * Select an idea to see business model canvas breakdown --- #### Front-end: React with React Router ```=javascript function App() { const [email, setEmail] = React.useState(""); const [loggedIn, setLoggedIn] = React.useState(false); const [ideasData, setIdeasData] = React.useState([]); const [dataUpdate, setDataUpdate] = React.useState(false); return ( <Router> <div className="App"> {loggedIn ? <Navbar email={email} setEmail={setEmail} setLoggedIn={setLoggedIn} /> : ''} <Switch> <Route exact path="/"> <LandingPage setEmail={setEmail} setLoggedIn={setLoggedIn} loggedIn={loggedIn} /> </Route> <Route exact path="/ideas"> <IdeasPage email={email} setIdeasData={setIdeasData} ideasData={ideasData} setLoggedIn={setLoggedIn} loggedIn={loggedIn} dataUpdate={dataUpdate} setDataUpdate={setDataUpdate} /> </Route> <Route path="/idea/:id"> <Idea ideasData={ideasData} email={email} loggedIn={loggedIn} /> </Route> </Switch> </div> </Router > ); } ``` --- #### Database: AirTable  --- #### Style: React Styled Components ```=javascript import styled from "styled-components"; const LandingLayout = styled.section` background-color: white; color:#3d3d3d; height: 100vh; padding: 0px; margin: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; ` ``` --- ### Design inspiration  --- # Demo --- ### Additional work to be functional * Login with authentication (can use Netlify Identity) * All data available on form * Edit/delete ideas * Comment on ideas * Better presentation of Business Model Canvas * Add filtering by tag --- ### Extra functionality * Profiles for founders who submitted the idea (linked with Zinc's founder book) * Invite other founders/partners/fellows to edit/add to idea * Add icon to quickly demonstrate startup progress (e.g. looking for cofounder) * Add filtering by stage --- # Thank you!