devlarabar / 100freelancers

100freelancers is a tool to keep track of freelance clients. It is a community, open-source project in the early stages of development.
https://100freelancers.vercel.app
MIT License
15 stars 11 forks source link

100freelancers

100freelancers is a tool to keep track of potential web development freelance clients.

View Demo · Report Bug · Request Feature

:page_with_curl: About

100freelancers was originally created to help members of the 100devs agency keep track of their client outreach. Rather than using spreadsheets, which can be messy and difficult to read, 100freelancers can be used instead to easily add, view, and track clients, as well as progress made on client work.

:computer: Tech Stack

React Next Express.js Tailwind CSS JavaScript Node.js MongoDB

:wrench: Structure

The wireframe below outlines the project's models and general layout. Authentication is done through Passport's Discord strategy.

wireframe-2023-09-08

Progress

Currently, the project has functional authentication and session storage through Passport, as well as functional adding of clients and outreach. There is also support for light/dark mode using DaisyUI. See below for screenshots!

Screenshot of 100freelancers Screenshot of 100freelancers

:memo: Installation

This app uses NPM to manage its dependences and packages.

  1. Fork and clone the repository

    git clone https://github.com/devlarabar/100freelancers.git
  2. Run the following in both the client and server directories:

    npm install
  3. Create an .env file in server/config/ and in client/. Copy everything from the respective .env.example files in both directories into these new files. Do not delete the example!
    For example, run:

    cp .env.example .env

    to copy the contents of .env.example into a new file named .env

  4. We have a local MongoDB instance set up through Docker. Docker Desktop will need to be installed to run the database. You can manage it using the following commands:

    To start the local MongoDB instance, run:

    npm run db:up

    To stop the local MongoDB instance, run:

    npm run db:stop

    With the local MongoDB instance in place, you can now connect directly without the need for MongoDB Atlas during development.

    To connect to the local MongoDB instance, follow these steps:

    1. Open MongoDB Compass.
    2. In the MongoDB Compass connection dialog, locate the "Connection String" field.
    3. In your .env file, located in the server directory, copy the DB_STRING, then paste this DB_STRING value into the "Connection String" field in MongoDB Compass.
    4. Click "Connect" to establish a connection to your local MongoDB instance.
  5. To run the app locally, navigate to the client directory and run:

    npm run dev

    Then navigate to the server directory and run:

    npm run db:up
    npm run serve

Contributing

Anyone is welcome to contribute! The following simplified example of the git workflow is what we will be following for the development of this app.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

When creating your Pull Request, please make sure to be as descriptive as possible about your changes. Explain what your pull request solves if it's not resolving an existing issue.

Color Reference

CSS Color Class Light Theme Dark Theme
Primary #F1F6F9 #F1F6F9 #355565 #355565
Secondary #142833 #142833 #D7E4EB #D7E4EB
Accent #0089B6 #0089B6 #0089B6 #0089B6
Base-100 #D7E4EB #D7E4EB #142833 #142833

License

Distributed under the MIT License. See LICENSE.txt for more information.