Self-employed

Sample Code

Had a great adventure sketching and launching a couple of businesses such as an e-commerce and a coffee shop. Between my eventual tasks as manager, barista and salesman, I had the opportunity to learn a lot, specially in the Digital Business area, where I found myself having the most fun designing and programming (as shown above: the paper cup design and the website design and code were all made by me). I created some projects within them as well, including an inventory control program, a digital menu and so on.

Stack: React.js, MongoDB, CSS, Gatsby.js

import React from "react"

import SEO from "../components/seo"
import Img from "gatsby-image"
import Menu from "../components/menu/menu"
import Instagram from "../components/instagram"
import LeafletMap from "../components/leafletMap"

const Home = ({ data }) => {
  return (
    <div>
      <SEO title="Home" />
      <section className="hero">
        <Img
          fluid={data.coffeehoodHero.childImageSharp.fluid}
          className="hero-image"
          imgStyle={{
            objectFit: "cover",
            objectPosition: "50% 20%",
          }}
          id="hero"
        />
      </section>
      <section className="container">
        <div className="about-grid about-grid-top">
          <h2>COFFEE</h2>
          <p>is always a good idea.</p>
        </div>

        <div className="gallery-grid">
          <Img
            fluid={data.spinachBread.childImageSharp.fluid}
            className="gallery-img1"
          />
          <Img
            fluid={data.coffeeBags.childImageSharp.fluid}
            className="gallery-img2"
          />
          <Img
            fluid={data.coffeePortrait.childImageSharp.fluid}
            className="gallery-img3"
          />
        </div>
        <div className="about-grid about-grid-bottom">
          <h2>COFFEE DIEM</h2>
          <p>
            Café pra relaxar. Café pra inspirar. Café pra conversar. Café
            melhora o dia.
          </p>
        </div>
      </section>
      <div className="parallax"></div>
      <section className="container" id="menu">
        <Menu />
        <Instagram />
      </section>
      {typeof window !== "undefined" && (
        <LeafletMap
          position={[-30.031753123466906, -51.22006035425074]}
          zoom={18}
          markerText={"Coffeehood, Sarmento Leite 282, POA"}
        />
      )}
    </div>
  )
}

export default Home