These Are the Droids You Are Looking For

A simple web app that retrieves biographical information of any character in the Star Wars universe.

Link to project: IN PROGRESS

landing page

How It's Made

Tech used: HTML, CSS, JavaScript, React, Express, Node.js, Tailwind (with DaisyUI)

Important: You must have Node.js installed. Both Tailwind and DaisyUI have already been configured in the app, but I recommend checking out the documentation if you're new to using CSS frameworks.

I wanted this to be a basic, fast-loading app. So I bootstrapped it with Create React App. The second thing to decide was the styling. Tailwind is a very popular option, so I went with DaisyUI because of the basic and elegant components it offers. For the back-end, nothing fancy, just Node.

Optimizations

IN PROGRESS

Lessons Learned

IN PROGRESS

Examples:

Take a look at these couple examples that I have in my own portfolio:

Precrastinator: https://github.com/diathekez/precrastinator

For Blossom: https://github.com/diathekez/for-blossom-api

Install

npm install

Things to add

  • Create a .env file in config folder and add the following as key = value
    • PORT = 3000
    • DB_STRING = your database URI
    • CLOUD_NAME = your cloudinary cloud name
    • API_KEY = your cloudinary api key
    • API_SECRET = your cloudinary api secret

Run

npm start