Booxmarkx

[Assessment project] Flickr and Vimeo bookmarks manager.

Stack

• Back-end:

  • Server: Node, Express, TypeScript
  • API: GraphQL, TypeGraphQL, Apollo Server
  • Database: MongoDB, Mongoose, Typegoose
  • Testing: Jest

• Front-end:

  • Tooling: Expo
  • Frameworks: React, React Native, React Navigation
  • State management: Redux, Apollo Client for React
  • UI: React Native Paper

Installation

For debugging purposes, this is the setup used during development:

• MongoDB version: 4.4.1
• Node version: 14.13.1
• TypeScript version: 4.0.3

Node

• You need to have Node installed: https://nodejs.org/en/

Source code

• Clone the repo in a local directory:

   git clone https://github.com/LeoDupont/booxmarkx.git
   cd booxmarkx

Database

You need to provide a MongoDB database URI, either to the .env file, or as a BOOXMARKX_MONGODB_URI environment variable.

If you don't have a MongoDB database ready, here are two ways to get one:

1. Get a free, personal, remote MongoDB Atlas cluster

2. Or setup a local database:

   1. Install MongoDB Community
   2. Start up a local database:

      cd back
      mkdir db
      npm run db

      Your new MongoDB URI is: mongodb://localhost:27017/

API

By default, the API will listen on port 8080, but you can override this with the BOOXMARKX_API_PORT environment variable (or in the .env file).

• Create a new file named .env, taking the .env-sample file as a model:

   cd back
   cp .env-sample .env

• Fill the .env file with missing info, if any.

• Install, build and start up the API:

   cd back
   npm install
   npm run start

The API now listens on http://localhost:8080

Front-end

1. Similarly to the back-end, create a .env file and fill it with missing info:

   cd front
   cp .env-sample .env

2. • You can directly serve the front-end with Expo:

   cd front
   npx expo start

   It will open the Expo dashboard, from where you'll be able to either "Run in web browser" or on your Android/iOS device/emulator/simulator.

   • Or you can build and serve the front-end for the web:

   cd front
   npx expo build:web
   npx serve web-build

   You can now reach the front-end on http://localhost:5000