The main purpose of my portfolio web app is displaying a space themed photo taken by NASA. It gives a descriptive exposition for each picture displayed. All the project tasks from development to deployment were made by me with the help of my peers despite the fact that i’m the only team member. This mini web app was created to anyone who’s into space exploration and geeking about any new informations for that matter, from galaxies to human made space stations. My focus was to determine how to make such a thing available online, i discovered the NASA’s open api and decided to lunch this frontend app by using REACTjs.
Since childhood, i found space exploration fascinating thus it made me wanting to become an astronaut like so many young kids all around the earth. I remember getting a lego game of the famous ‘Millennium falcon’ spaceship from the infamous Star Wars movies, i spent entire days assembling and disassembling it. So i can assume that Star Wars influenced my love for space through it adventurous scenarios. As a result of this deep admiration for space i found it to be the right thing to do as a portfolio project because i can finally make information available daily to space enthusiasts like myself. So i went to none other than the biggest data recruiting platform of space exploration; NASA, scrolled through the list of api’s available and decided to use the APOD (Astronomy Picture Of the Day) for my web app because it offers the accessibility for information each day like you were checking zodiac signs daily, you can check a new space information each 24 hours.
Summary of the making process:
- The web app is accessible via mobile because it’s responsive and dynamic. Users can access it with their smartphones.
At the beginning of the portfolio the main idea was to give space geeks a web platform that displays information on a varieties of space exploration topics. I began by searching the possible way of setting up a frontend web app through different development options and made the decision of going with npm for NODEjs and using REACTjs routing for my desired app because using both tools together gave me easiness of coding and the simplicity of creating and building my project. Then came in the part of searching ways to implement some actual content in my web app and not any random content, I wanted it to be space specific and related content. Hence I found that we can use API’s in the portfolio project’s instructions. So without searching more I jumped directly into the NASA open api’s page and scrolled through the wide choice of available api’s, finally I made my choice on the APOD api. At first I didn’t encounter any major issues with the creation of my web app and REACT was easy to learn except some hurdles like I had to get my NODE packages up to date to be able to create a web app running on localhost:3000, also I had to reach out to some peers because I couldn’t find the right way of defining and routing my web app components. Like I said it wasn’t easy but I had couple of challenges and they are related to learning and mastering the REACT framework basically. I managed to get my app running on my localhost with all it’s components rendered on the browser but had to hide my API key, so again I reached out to my helpful peer and he suggested that I hide it in an environment variable so it won’t be pushed to the main working repository that way I could hide it away from malefic users. At the end I didn’t encounter much of a trouble deploying my web app with GitHub Pages except that I found it a bit slow to actually deploy the app as I got anxious waiting for it to get deployed a day before the presentation date.
What i learned working on this project:
The main take-aways of using REACT and NPM are that both are very time and effort saving options and also they can boost productivity in a team scale. They perform well and they are easy to learn. If I had to do anything different It would be trying to make this frontend app using Angular maybe because it’s a much complete framework in itself and maybe adding some backend features like a database for the likes given by. Users to a certain picture. I leaned on a personal level that I can make anything possible with the right mindset and dedication, working on tis project gave me the opportunity to rediscover my hidden abilities of focusing and dedicating myself to a certain task, hopefully I can carry on with this attitude to the professional environment as it would certainly be helpful in climbing the ladders of software engineering. At the first I had a belief that JS is a great tools for web development and this project confirmed that prior belief as it is very responsive and dynamic tool.
At the end:
My name is Taha Yazidi, a future software engineer from Tunisia and space enthusiast. Below are the links to my professional profile and the web app project. Thank you !
This project was bootstrapped with Create React App. Run npm install to install the dependencies. Visit NASA's API page…