Web-Dev

💁 Description

This repository contains various Web development projects along with their codes. The projects are of beginner level. Also, this repository has all the tech stacks arranged in different folders required for developing a Full stack project.

💻 List of Projects

This repository consists of 8 beginner friendly web development projects inside the Projects folder.

1. 🐶TinDog : It is a landing page for a fictional application named TinDog. TinDog allows the user to find other dogs & their owners nearby in the swipe left/right style made famous by Tinder.

2. 🥁Drum Kit : The project is used to implement DOM Manipulation and Event Listeners using JS-ES6. It is basically about when you click the button or use your keyboard, it will sound the drum.

3. 🎮Simon Game : The original Simon Game was created in 1978, inspired by an arcade game by Atari called Touch Me. It is made using HTML, CSS, JavaScript and JQuery.

• Instructions:

• Press any key to start the game.

• Follow the sequence dictated by the game.

• If you succeed, you will go on to the next level.

• If you fail, the game will end.

• But you can always start a new one by pressing any key again!

4. 🕛Analog Clock : A simple and beautiful Analog Clock made using CSS, HTML & Javascript and JQuery.

5. 🌤️Mars Weather App : This is a simple app made with HTML, CSS, Javascript responsible for detecting the weather of MARS using NASA API. Also, this website is deployed on Heroku.

6. 📁File Uploader : This is a simple project responsible for uploading and downloading files built using HTML, CSS, Tailwind CSS and Javascript.

7. ✅Todo List : Simple and beautiful Todo list web app built using Node.js, configured routes using Express.js, Connected it to MongoDB cluster and performed CRUD operations with Mongoose . Formed templates with EJS . Deployed the web-app to Heroku cloud.

8. 📝Blog website : The Web app focusses on implementing Full Stack Web Development Using NodeJS and ExpressJS as backend along with use of EJS for templating and layouts functionality for better code structuring. Also used Lodash for working with url and strings. This project is a template for a simple personal diary/blog website.

👨‍💻 Tech Stacks

HTML : HTML (HyperText Markup Language) is the code that is used to structure a web page and its content. For example, content could be structured within a set of paragraphs, a list of bulleted points, or using images and data tables.

CSS : Cascading Style Sheets is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

BootStrap : Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains HTML, CSS and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.

jQuery : The purpose of jQuery is to make it much easier to use JavaScript on your website. jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.

ExpressJS : Express is a node js web application framework that provides broad features for building web and mobile applications. It is used to build a single page, multipage, and hybrid web application. It's a layer built on the top of the Node js that helps manage servers and routes.

APIs : API stands for Application Programming Interface. In the context of APIs, the word Application refers to any software with a distinct function. Interface can be thought of as a contract of service between two applications. This contract defines how the two communicate with each other using requests and responses.

mongoDB : MongoDB is a document database used to build highly available and scalable internet applications. With its flexible schema approach, it's popular with development teams using agile methodologies.

REST API : A REST API (also known as RESTful API) is an application programming interface (API or web API) that conforms to the constraints of REST architectural style and allows for interaction with RESTful web services. REST stands for representational state transfer.

Redux : Redux is an open-source JavaScript library for managing and centralizing application state. It is most commonly used with libraries such as React or Angular for building user interfaces.