Portfolio Review?

#help #gatsby #portfolio #webdev

Sahil Bondre Oct 11, 2019 ・1 min read

Hi, I made a portfolio for the first time. I've used Gatsby to make it. I'd like to hear your thoughts on it!

Portfolio
Source Code (In case you are curious)

Thank you! Have a wonderful day! 😄

Discussion

Goat Thinking • Oct 11 '19

All of this is a preference of mine, so take it as you will.

Home/Index Page:

No link to home. You can click the rocket and SAHIL BONDRE text on the top left to get you there,
but there is no specific "Home" on the top right with your "Projects" and "About".
The gap between "Hello!" and the text under it does not match the gap between "Tools of Trade" and the images under it.
I don't like the alignment of things on said home/index/landing page. The top wave, "Hello!" and text under it are left-justified along with "Tools of Trade" and the images are as well. However, the bottom icons are centered. Suggest changing all of the home/index to a centered format.

About Page:

I always tend to call this site dev.to, both when typing and speaking in person to friends. Don't know if that is proper, but it helps identify it verses any other generic "Dev" thing.
I would move the "HERE'S MY RESUME" to the bottom, after the "Have a Fun ${day} !"

Again all this is my preference, but it might spur some other conversation or help you identify some things on your own. Good job on it and I hope it works well for you!

Sahil Bondre • Oct 11 '19

Thank You for your review! I'll make some changes soon. 😊

Akhilesh Kumar • Apr 10 '20

Can you help me understand how does this firebase thing works when you are adding a new subscriber to your mailer?

Sahil Bondre • Apr 10 '20

Yea Sure!

I am using firebase a backend just to store the list of emails. So the only product I am using of firebase is firestore.

Every firebase project has some config data associated with it. This is essentially like a password that allows you to access the backend. I have stored this data in a file called firebase-config.js. This file is not on version control (github) as I has secret data. Here's the code inside it:

import * as firebase from "firebase/app";

import "firebase/firestore";

const firebaseConfig = {
  // Secret Credentials from Firebase
};

export default firebase.initializeApp(firebaseConfig);

This file export the firebase object which is imported by src/components/MailBox/index.js. This is used to perform write operations to the database.

// line 4
import firebase from "../../firebase-config";

// line 15 in MailBox Component
subscribe = () => {
  const mail = this.state.mail;
  if (!this.validateEmail(mail)) return;

  const db = firebase.firestore();
  db.collection("emails").add({
    mail: this.state.mail,
    source: "sahil.surge.sh"
  });
  this.setState({ subscribed: true });
};

You can read more in the firebase documentation:

Note that people usually go with using something like MailChimp to manage mailing list. I've gone this way just so that I can personally mail and communicate with people

Hope I cleared your doubts.