Awesome

Free + Full Stack + Open Source + Rapid API Development

</h3> <h3 align="center"><i>Powered by <a href="https://loopback.io/">LoopBack</a> and <a href="https://angular.io/">Angular</a></i></h3>

About

Colmena is a starter kit for an API with an Admin interface that can be easily extended and built upon.

It is built using a collection of great Open Source projects, including but not limited to:

LoopBack - API server based on Express.
Angular - MVC framework to build web apps.
LoopBack SDK Builder - Awesome integration of Loopback and Angular.
CoreUI - Amazing Bootstrap Admin Template.

⚠️ Warning

This software is under active development!

Please do not use it in production without addressing the issues in the Work in Progress section

Work in Progress

Colmena is a work in progress and not all functionality is built yet.

Only basic ACLS are implemented, this means that the API can be used by whoever has access to it
The interface does not reflect the user role (admin/manager/user)
Content will be leaking across domains, while this should not be possible

Structure

The project is a mono-repo managed by lerna. It is structured like this:

apps/
- admin The Admin interface built with Angular.
- api The REST API built with LoopBack.
modules/
- admin-* Modules that add functionality to the Admin app.
- api-* Modules that add functionality to the API app.
packages/
- admin-* Packages used by the Admin app.
- api-* Packages used by the API app.

The structure of this project is inspired by this great example: OasisDigital/scalable-enterprise-angular.

Installation

Requirements

Software installed on your system:

node (v6.9.x or higher).
npm (v3.x or higher).

Globally installed Node packages:

npm install -g @angular/cli lerna loopback-cli

Setup

Clone the repository and install the dependencies:

git clone https://github.com/colmena/colmena
cd colmena
npm install

Development

Running in development mode

When the project is running in development mode the API and the Admin will restart automatically when a code change is detected.

URLs

The API listens on http://127.0.0.1:3000.
The Admin listens on http://127.0.0.1:9000.

Start the project

From inside the project dir run npm run dev:

npm run dev

This will start both the API and the Admin in the same terminal.

You can also start the two components separately:

Start the API

npm run dev:api

Start the Admin

npm run dev:admin

Clean up the project

During development it can be useful to bring the project back to a clean state. To do this run:

npm run clean && npm install

Configuring the development setup

local.yaml

You can configure the API in development mode by creating a local.yaml file in apps/api/config. The contents of this file is not tracked by git so it only lives on your local machine.

To start with the default settings copy apps/api/config/default.yaml to apps/api/config/local.yaml.

Sample data

The API comes with a set of sample data for development.

To load the sample data when starting the API update local.yaml to include:

system:
  initdb: true

You can also use the INITDB environment variable.

API Base Url

By default the development stack assumes that the API and Admin are both started on localhost (using 127.0.0.1).

In order to run the API on another host than localhost the admin needs to know on which IP address it can reach the API. To do this you need to update the api.baseUrl config property.

Make sure to configure the API Base Url without a trailing slash.

To set the API Base Url update local.yaml to include:

api:
  # Do not use trailing spaces for the baseUrl
  baseUrl: http://192.168.12.34:3000

You can also use the API_BASE_URL environment variable.

You should now be able to connect to the Admin on http://192.168.12.34:9000 and it should connect to the API.

Development Servers

Colmena comes with a Docker Compose configuration for running development servers easily.

mongodb

To use the mongodb server update local.yaml to include:

mongodb:
  url: mongodb://localhost/colmena

You can also use the MONGODB_URL environment variable

mailhog

To use the mailhog server update local.yaml to include:

smtp:
  host: localhost
  port: 1025

You can also use the SMTP_HOST and SMTP_PORT environment variables

Start the servers

npm run servers # or: npm run servers:start

Show the servers logging

npm run servers:logs

Stop the servers

npm run servers:stop

Delete the servers

npm run servers:rm

Contributors

Thanks goes to these wonderful people (emoji key):

<img src="https://avatars.githubusercontent.com/u/36491?v=3" width="100px;"/><br /><sub>Bram Borggreve</sub><br />💬 🐛 💻 🎨 📖 🔧	<img src="https://avatars.githubusercontent.com/u/1755489?v=3" width="100px;"/><br /><sub>Willian Ribeiro Angelo</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/977025?v=3" width="100px;"/><br /><sub>Nick Portokallidis</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/90312?v=3" width="100px;"/><br /><sub>drmikecrowe</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/1899626?v=3" width="100px;"/><br /><sub>Vladimir Mechkauskas</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/4164460?v=3" width="100px;"/><br /><sub>Bernardo Arevalo</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/8195533?v=3" width="100px;"/><br /><sub>yieme</sub><br />💻
<img src="https://avatars.githubusercontent.com/u/339169?v=3" width="100px;"/><br /><sub>Brian McIntyre</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/274358?v=3" width="100px;"/><br /><sub>Rob Halff</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/3543429?v=3" width="100px;"/><br /><sub>Asgeir Birkisson</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/6855743?v=3" width="100px;"/><br /><sub>dthib</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/3319777?v=3" width="100px;"/><br /><sub>Oleh Kukil</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/821963?v=3" width="100px;"/><br /><sub>Pulkit Singhal</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/1904924?v=3" width="100px;"/><br /><sub>Tuan PM</sub><br />💻
<img src="https://avatars.githubusercontent.com/u/314539?v=3" width="100px;"/><br /><sub>brownman</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/8570291?v=3" width="100px;"/><br /><sub>Hoàng Phúc</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/175838?v=3" width="100px;"/><br /><sub>Brian Dunnette</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/4792828?v=3" width="100px;"/><br /><sub>Chenzc</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/6417718?v=3" width="100px;"/><br /><sub>Tersius Kuhne</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/1888261?v=3" width="100px;"/><br /><sub>Alex Quiambao</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/791137?v=3" width="100px;"/><br /><sub>José Luis Di Biase</sub><br />💻
<img src="https://avatars.githubusercontent.com/u/5630513?v=3" width="100px;"/><br /><sub>Shing.</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/67973?v=3" width="100px;"/><br /><sub>Alex Wilde</sub><br />💻	<img src="https://avatars.githubusercontent.com/u/529030?v=3" width="100px;"/><br /><sub>dmtw</sub><br />💻	<img src="https://avatars3.githubusercontent.com/u/5523938?v=3" width="100px;"/><br /><sub>Marcus</sub><br />💻	<img src="https://avatars2.githubusercontent.com/u/6089253?v=3" width="100px;"/><br /><sub>Brannon N. Darby II</sub><br />💻

This project follows the all-contributors specification. Contributions of any kind welcome!

Backers

Support us with a monthly donation and help us continue our activities. [Become a backer]

Sponsors

Become a sponsor and get your logo on our README on Github with a link to your site. [Become a sponsor]

This project was formerly known as Loopback Angular Admin.