DEV Community: Anandprabhu530

New personal Website

Anandprabhu530 — Mon, 27 Nov 2023 11:49:42 +0000

Hello everyone!
I'm thrilled to share my personal website.

anand-prabhu.netlify.app

I've been learning Full Stack Development for quite a while now. When applying for jobs, I noticed that every job listing has an option to submit a personal portfolio. Initially, I thought of creating one later, but after applying for hundreds of positions and facing rejections, I realized the importance of having a personal website.

Even while developing my personal website, I learned how crucial the user interface is. Users expect a seamless user experience across the entire website. After countless hours of coding and designing, I finally completed my website.

It's currently not mobile-friendly. My next task is to ensure that it's responsive across all platforms.

I would greatly appreciate your feedback to further improve my website.

I was wrong about CSS this whole time!

Anandprabhu530 — Sun, 22 Oct 2023 14:35:07 +0000

Recently, I developed an Image Gallery Application (like unsplash.com). When I started this project, my mindset was to finish it without any errors. So, I jumped right in and planned how to split and develop it. Up to this point in time, I had ignored the styling part while developing applications. I would jump straight into the logic of the application. But until this point, I have never tried to do my best in CSS.

At first, based on the requirements, I thought that the development process would take around 4-5 hours. But after starting to style the application, I realized that I was wrong this whole time. I didn't even cared about CSS this whole time. Even when I developed applications that had styling in them, I had followed some kind of tutorial or reference videos.

But after making these many mistakes, I realized the importance of CSS and how it affects everyone's perspective of viewing any content. Even though the application is blazingly fast or have good functionalities, it will not be enough. An average user of the website will evaluate the website based on its appearance too.

From now on, I will be learning CSS and including it in every project. Throughout this Image Gallery application development, I have learned a lot in CSS.

Building My First Full-Stack Web Application with React, MongoDB, Node.js, Express.js

Anandprabhu530 — Thu, 12 Oct 2023 11:34:12 +0000

Hi everyone!

I am a student who is interested in web development. Please bear with me if there are any mistakes, as this is my first time writing an article.

I am excited to share that I recently built my first web application: a URL shortener! I have been learning web development for a few months now, and I wanted to challenge myself by building something real and useful.

At first, a URL shortener may seem like a small project, but it gave me a solid understanding of how front-end and back-end development communicate with each other.

For the front-end of my application, I used React. This gave me a solid understanding of how components work and how they are updated. I also learned how to use the useState, useEffect hook and how to update values using it.

Create your REACT Project. I have used Vite as my build tool,

npm create vite@latest
npm install

Then create the HTML Page and then add the required function

Adding the functionalities to the application:

For the back-end of my application, I used Node.js and Express. To store the long and short URLs, I used MongoDB. Throughout the back-end development process, I learned what schemas, models, and documents are in MongoDB. I also used Mongoose to carry out operations such as connection, creation, deletion, and others.

Require the needed library

Setup the routes:

Recent developments with AI models like Bard have made learning easier. These tools gave me an insight into the steps needed to develop an application. This gave me the advantage of not wasting time and getting straight into development. It also helped me with places where I got stuck and helped me to fix them.

You can check it out here:

Anandprabhu530 / Url_Shortner

Url_Shortner

Built with React, MongoDB,Express.

Try it out:

Step 1:

git clone https://github.com/Anandprabhu530/Url_Shortner.git

Step 2:

cd client

npm install

cd ../server

npm install

Step 3:

In index.js replace the variables with your MongoDB credentials.

Step 4:

cd client

npm run dev

In another new terminal

cd server

npm run start

View on GitHub

Thank you for reading this article. I will be back soon!