Giter VIP home page Giter VIP logo

bloktech's Introduction

Mix & Match

The concept ๐Ÿ’ญ

I really wanted to chose a topic that spoke to me and that I found interesting. I wanted to make my matching app about music, so I decided to build it around finding concerts and festivals that suits your liking. On the Concept page you will find more information on how I established my concept.

The feature โš™๏ธ

The feature I chose to build for my matching application is registration. I chose this feature, because I was really interested in how this can be created. I also thought this would give me a little bit of a challenge. When registrating for the matching application, it is possible to fill out the form in order to create your account. You can specify preferences, log in and delete your account.

Pre-installation ๐Ÿ”ง

Git (Windows)

Download and install Git for Windows.

  • Select your own preferred editor (in my case Visual Studio Code).
  • Make sure you override the default branch name for new repositories. If you choose 'main' as default branch name, this will align with the default used on GitHub.
  • Finally select 'Git from the command line', so you can use Git commands in PowerShell.

Make sure you have git connected to your own github. Do this within your commandline like so: Connect Github to git.

Node.js

Download and install Node.js.

  • Make sure you download the LTS version(currently 18.16.0). This is the version that has the longest support.
  • When installing make sure you select the npm package manager and not the default of Node.js runtime.

When you have done these steps, you can check if git, node and npm are correctly installed and have the right version. Run these commands in your terminal:

git -v 
node -v 
npm -v 

MongoDB

Before you are able to use the Mix&Match application, you have to connect to a database. In my case I used MongoDB. Create a MongoDB Cloud account. From here follow the steps on the MongoDB Guides page. Here is a small summary of the steps:

1. Create MongoDB account
2. Create a cluster
3. Add a database user
4. Configure a network connection
5. Load sample data
6. Get connection string

When you create your Cluster in Atlas you might need to Whitelist your IP.

When you have followed all these steps you can begin to install the Mix&Match application!


Installation ๐Ÿ”จ

Clone this repository to your own device

git clone https://github.com/TristanBrattinga/bloktech.git

When you have installed all the prerequisites, navigate to the project directory:

cd <path>/<path>/bloktech

Now install the required dependencies & devDependencies by running the following command:

npm install

Create a .env file and store sensitive information such as your database URI, password and username in this file .env using the dotenv package.

This should already be installed if you ran the command npm install.

My .env file looks like this:

PORT='<port which the server is hosted on>'
DB_USERNAME='<database username>'
DB_PASSWORD='<database passpowrd>'
DB_URI='<database uri string>'
DB_NAME='<database name>'
DB_COLLECTION_1='<collection name>'
DB_COLLECTION_2='<collection name>'

Make sure you add the .env file to your .gitignore.

Also include your node_modules folder in your .gitignore file.

Run ๐Ÿƒ

To start the application I have made some npm run scripts. These make it easier to work with your application.

To start the application in normal mode, run:

npm start

To start the application in dev mode, run this command:

npm run devStart

After starting the application, open your browser and navigate to:

localhost:8080

Thank you for reading this README file and checking out my application. I hope you enjoyed!

Wiki ๐Ÿ“–

In the Wiki you can find all the information about this project and the matching application I have built.

Sources โคต๏ธ

You can find all the cited sources in my Wiki Resources Page.

License ๐Ÿ”

MIT

Disclaimer: All of the code and documentation found in this repository is written by myself or quoted.

bloktech's People

Contributors

tristanbrattinga avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.