Coder Social home page Coder Social logo

braggers's People

Contributors

akarakehayova avatar mlukanova avatar ngeorgieva avatar pltod2 avatar vladimir-trifonov avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

braggers's Issues

Use Case: Synchronize users

This scenario explain one idea of introducing users into the system.

  1. Get data from slack and GitHub, combine it and store it into users.json

  2. In Admin Mode we will have a Button to start the process of importing users that are still not present...if the email exists the user will not be considered. The reason is that we do not want to override the already imported and augmented users.

  3. Possible we could design command line tool to our system. This command line tool will be able to trigger similar operation but form the Terminal. Also it could start and stop process that do this in background so new users appear on the fly.

User Model printed in the browser

Integrate the code from app.js into web application that we have with webpack and react. In order to complete this the following must be done:

Move the web app code into your branch

Take your logic from app.js and put it into App.js react component into newly created function called componentDidMount. This is lifecycle method that react invokes after initial rendering of your component. See more here https://facebook.github.io/react/docs/react-component.html. To understand react in general look this short tutorial - https://facebook.github.io/react/tutorial/tutorial.html

When you collect all of your data call the setState with the data set into state property of your choice. This will cause the react to re-render the component with the provided data.

CLI

Command Line Interface with commands that will be used to demonstrate import and export of data. This will communicate directly with our API Server.

Use Case: Login

I would like to have passwordless login. Here is the thing:

  • We have users in the system with emails

  • Show form with only email input - when user enters valid email we will send email with confirmation link that will login this user into the system

I imagine this to be done with password less + stateless meaning to use something like JWT and not mongo or redis stores.

Sample links would be used to craft the solution:

https://blog.risingstack.com/node-hero-node-js-authentication-passport-js/

https://community.risingstack.com/zeromq-node-js-cracking-jwt-tokens-1/

https://community.risingstack.com/zeromq-node-js-cracking-jwt-tokens-part2/

https://github.com/florianheinemann/passwordless

https://jwt.io

protected and non-protected endpoints -> https://scotch.io/tutorials/authenticate-a-node-js-api-with-json-web-tokens

Complete User Model with data from Slack and Github

Here are the steps:

HINT: you can do the work for step 1 in a branch and submit PR after which you could do the step 2 in separate branch and submit PR. More granular work that cover single concern in PR is better.

Step 1

Continue working in app.js. Take the data from Slack as it is now. Use the emails list to make request to Github in order to take the data for users by their email address. The data from Slack and Github should be merged into single User Profile Model and printed to the console.

How to access GitHub

You access GitHub in the same manner as other APIs services. You need token etc. .... More general info here: https://developer.github.com

Moreover you need SDK to consume the API. There are alternatives out there.

One example of mine using octonode (https://github.com/pksunkara/octonode) API wrapper that collect who the user is following is here - https://github.com/pltod/hb-nodejs-2014/tree/master/shared/api/facade-github-octonode

Alternatives to octonode wrapper are:

Step 2

Integrate the code from app.js into web application that we have with webpack and react. In order to complete this the following must be done:

  • Move the web app code into your branch

  • Take your logic from app.js and put it into App.js react component into newly created function called componentDidMount. This is lifecycle method that react invokes after initial rendering of your component. See more here https://facebook.github.io/react/docs/react-component.html. To understand react in general look this short tutorial - https://facebook.github.io/react/tutorial/tutorial.html

  • When you collect all of your data call the setState with the data set into state property of your choice. This will cause the react to re-render the component with the provided data.

API Server

This is going to expose endpoints that will implement the business logic of our application.

The purpose is to implement the business logic in a way that it could be plugged into different underlying server technology.

API Server is the existing express server -> npm run express; However we are going to remove serving the static files from here. We going to have dedicated server for this.

Learn LokiJS and tape - ALL

Make yourself familiar with 1) LokiJS because we all will deal with persistence at one point in time 2) Writing tests with tape - see example test suite from lectures code examples - everyone of you must write one test suite for particular service (remember we will have services per each aspect that will weave into our app)

Please leave comment when you are already good to go with LokiJS and tape

http://lokijs.org

https://github.com/substack/tape

Deployment

Flexible deployments:

  1. Logic on different server

  2. App on different cloud

Research on the proper architecture to accommodate all requirements.

We are looking on the best architecture so we could:

  • create reusable npm modules

  • combine a lot of external APIs - Github / Slack / Medium / Discourse

  • fit the structure of internal to external models - e.g. Bragger Post - Medium Post (data transformation)

  • technology stack

  • more...

Demo Flow

Purpose

Here we are going to describe how we are going to present the application - the demo scenarios.

Flow - FE only with local DB

  • Initially our local DB is empty

  • We are going to try to enter with email into the system but there is no such user

  • Then we start the CLI and init the local DB with User Models (combined from slack/github)

  • Fill the email and login into the system where we see the user feed with posts etc.

UI Activities

  • Make a post

  • Like post when logged in with another user and see the result.

  • Create forum category / topic and post and write comment.

  • etc.

Third Party Integrations

  • Try to import data from Medium/Discourse into our DB via connectors in seamless manner. This usually would be done via administrative interface but could be as well started from the CLI. Basically everything should be written in a manner that is reusable to be consumed via UI and CLI.

  • The imported data should be available in the User feed

Flexible Deployments

We are going to demonstrate how we are able to switch the environments.

Migrate to infrastructure 1 -> Express/MongoDB/Now

  • Execute the export script via CLI so we fill mongo db with data

  • Reuse http handlers that allow us to dynamically expose endpoints to Express

  • Configure the FE to work with another source of data - replace local with http server

  • Static resources will always be served from web pack dev server...they are easily transferable between CDNs

Migrate to infrastructure 2 -> Arrow/ArrowDB/Arrow Cloud

  • Execute the export script with another transformer appropriate to Arrow DB

  • Reuse http handlers that allow us to dynamically expose endpoints to Arrow

  • Configure the FE to work with another source of data - replace local with http server

  • Static resources will always be served from web pack dev server...they are easily transferable between CDNs

Themes

  • Changing themes at build and run time. This is a matter of having web pack 2 to work with postcss and it is not of major priority

Export/Import Data

Purpose

We need to have an open data which is really easy to export to another datastore.
That is why we use json files as our datastore.
This allows us to move fast with the application and in the same time we can easily put this data in appropriate store later on.

Task

Write program that uses streams and do the following:

  • read JSON files used as database
  • can accept transformer application that will transform to appropriate format
  • send newly formatted data via DATASTORE SDK to the destination datastore

This program would be used by CLI described in #18

Steps to create it

Phase 1 - Initial Version

  • first read some resources to get familiar with streams

https://nodejs.org/api/stream.html

https://github.com/substack/stream-handbook

https://github.com/workshopper/stream-adventure - do this workshop

  • write a program that reads JSON files with random structure and streams them to another file

Here you can improvise with reading many files and writing into single file or reading source files and writing them into destination files with 1 to 1 mapping.

Phase 2 - Design for plugin transformers

Design the program so it can be parametrized with receiving different transformer - mongoldb / arrowdb etc.

Phase 3 - Implement ArrowDB transformer

Get familiar with the complete JSON structure of braggers .... get familiar with ArrowDB SDK (one of next lectures will handle this) and write 1 transformer for ArrowDB so we could deploy the application on Arrow Cloud.

Resources

These could be useful:

https://github.com/dominictarr/JSONStream

https://github.com/pltod/hb-nodejs-2014/tree/master/week6 - some small apps that I made with streams before

Static Resources Server

This is going to serve the static resources and the front end application. This is the web pack development server but could be any other that is able to serve static files.

Persistence: Add LokiJS to the mix

Persistence module with http://lokijs.org/#/

Make yourself familiar with 1) LokiJS because we all will deal with persistence at one point in time 2) Writing tests with tape - see example test suite from lectures code examples - everyone of you must write one test suite for particular service (remember we will have services per each aspect that will weave into our app)

Please leave comment when you are already good to go with LokiJS and tape

http://lokijs.org

https://github.com/substack/tape

Purpose

The task is to create a service that will allow us to persist data into JSON files on the file system and write test suite with tape (as it is used in the lectures) to test it. Use LokiJS so you can learn about LokiJS and make the initial step to use it into our system.

You can try storing JSON data into files on the file system. Imagine we have to store users, blog posts etc. into different XXX.json files on the file system and we want to make it with LokiJS. Basically that will be our Database.

Make it like reusable module

You can even think further with creating wrapper to LokiJS in the form of node Module like this:

//1. your implementation of the functions bellow based on LokiJS should be here
//2. then export your module API like that
module.exports = {
insertMany: insertMany,
insertOne: insertOne,
findAll: findAll,
rmAll: rmAll,
rmOne: rmOne
//OTHER METHODS AS NEEDED
}

You can see something similar done but with node-persist here https://github.com/pltod/hb-nodejs-2014/tree/master/shared/db/facade-node-persist

HTTP Facade

superagent or request or browser native module

responsibility for doing http requests to the API server

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.