Git Product home page Git Product logo

openmined-website's Introduction

OpenMined Web Monorepo

Welcome to the OpenMined web monorepo, the home of all of OpenMined's many websites. Below are some basic instructions for getting this repository running on your machine.

Support

If you're looking for support about the courses, please go the Courses Discussion Board. If you've found a bug, or have a suggestion for an improvement to the Courses site, or any of our websites, please file an issue here.

Contributing

We are currently only accepting bug fixes from our community at the moment. If you're interested in working on these sites regularly as part of a team, please DM @Patrick Cason on Slack with your resume and qualifications.

Local Setup

  1. Make sure that you have Node, NPM, and Yarn installed on your machine.

  2. Install NX, our monorepo management framework.

  3. From this point forward, you will run all commands in the root folder. Start by running yarn install to install all dependencies.

  4. Run one of the below commands, depending on what you're trying to do... note that the third word in the command corresponds to the app in question. For instance, yarn start courses will run the courses app, located at apps/courses.

Courses

The OpenMined Courses website where we host our educational material. The site is a React.js web application, running on a Firebase backend, Jest for testing, Cypress for end-to-end testing, and using Sanity.io as the content management system (CMS).

  • yarn start courses - Runs the courses site with hot reloading for development purposes.

  • yarn lint courses - Runs the linter for the courses site

  • yarn test courses - Runs the test suite for the courses site

  • yarn build courses - Builds the courses site

  • yarn build courses --prod - Builds a production version of the courses site

  • yarn analyze courses - Analyzes the file sizes and distribution of a built version of the courses site

Courses E2E Testing

The OpenMined Courses website uses Cypress for end-to-end-testing. You have access to the following commands:

  • yarn e2e courses-e2e - Runs all the end-to-end tests for the Courses website

  • yarn lint courses-e2e - Runs the linter for the courses end-to-end app

Firebase API

Firebase is the primary backend for all of OpenMined's websites. If you want to test any functions or security rules before pushing them live, you may do so using the emulator suite.

  • yarn test firebase-api - Runs all the tests for the our Firebase backend

Sanity CMS

Sanity is the primary CMS for all of OpenMined's websites. You must have a user account to change any actual values, however, if you want to run it on your machine, you have access to the following commands:

  • yarn start sanity-api - Runs the Sanity CMS with hot reloading for development purposes.

  • yarn lint sanity-api - Runs the linter for the Sanity CMS

  • yarn test sanity-api - Runs the test suite for the Sanity CMS

  • yarn build sanity-api - Builds the Sanity CMS

  • yarn build sanity-api --prod - Builds a production version of the Sanity CMS

  • yarn analyze sanity-api - Analyzes the file sizes and distribution of a built version of the Sanity CMS

openmined-website's People

Contributors

cereallarceny avatar curt-mitch avatar dependabot[bot] avatar fmhall avatar iamtrask avatar jvmncs avatar kevinahuber avatar lariffle avatar madhavajay avatar metrix1010 avatar tcp avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

openmined-website's Issues

Brand guide link will not update

Yet to be determined if this is an issue with Cloudfront cache invalidation, local cache invalidation, or an issue with React Router. For some reason, whenever we redeploy, the route for the brand guide doesn't update. Likewise, we can't get any static assets to load in the browser. Examples:

https://openmined.org/images/logo.png
https://openmined.org/images/logo-facebook.png
https://openmined.org/images/logo-twitter.png

And of course, the brand guide itself: https://openmined.org/assets/openmined-brand-guide.pdf

Fix GitHub content

Top contributors of Grid is empty, and Syft.js displays neither issues nor top contributors.

General improvements to homepage Redux module

There's three or four todo's within the homepage Redux module. They involve restructuring the way data is inserted in to replace the initial props. I'd love to see this more optimized and not so heavily dependent on a hard structure in the API. It may be that this is unavoidable and should be fixed by creating a single Wordpress endpoint to handle the entire homepage and all Github data.

Likewise, the way we're parsing data from the back-end is insanely ugly. We could use recursion to climb up and down the data tree far easier. But that sounds hard... somebody else want to take an attempt at cleaning this up?

Shorter Install URI

curl -s https://raw.githubusercontent.com/OpenMined/mine.js/hydrogen/.docker/docker-compose.yml | docker-compose -f - up

is now the same as

curl -Ls git.io/openmined | docker-compose -f - up

Loading image does not load initialy

When loading a new page the loading image does not load immediately which results in the words openmined spinning. The image loads when the page is almost loaded.

Middleware doesn't skip over certain files

The current middleware uses create-react-server to render over the server. The problem is that we have times where requests come in for [object%20Object], [object Object], and sw-precache. The first two are related to images, the last one is related to the default service worker rendered by React.

This is a multi-part issue and doesn't currently have a known fix.

Part One
Get the Express middleware to skip over any objects (which I believe are images in the bundled Javascript that are replaced at runtime). This could be as simple as using skipRequiredExtensions, although I don't know.

Part Two
The service worker makes server-side rendering a bit difficult. I've not seen an example of using the default create-react-app service worker in conjunction with server-side rendering. I'd love to be proven wrong.

Small Typo

In Step 1 on the homepage "train" -> "trains"

Reorder Projects in Website

The website currently has projects in the order GRID, UnityWorker, PySyft with GRID being the default selected. If we could reorder this (from left to right) as PySyft, Grid, UnityWorker with PySyft being the default, that would be lovely!

Process Section Interaction not obvious

The visuals on in this section are fantastic. One issue that users might have at first glance is that the other sections that come after 'Create' might not be obvious. Is there a way we could hint that there's more content and the 'Distribute', 'Train' etc sections are also clickable? What do you guys think?

Implement Wordpress.com backend using API connection for editing copy

This is fairly large of a task. We want to create a Wordpress.com purely for editing the website's content. The website will remain in React, but will consume a Wordpress API. Before attempting this, please volunteer to do so in this thread and let's all discuss the technical implementations of such a PR.

Reduce Line Length

Some lines on the site are more than 150 characters long. The material design guideline on typography quotes an advice from the Baymard Institute:

You should have around 60 characters per line if you want a good reading experience. Having the right amount of characters on each line is key to the readability of your text.

Split pathname more intelligently

Current location props are being received and split rather poorly:

let pathname = props.location.pathname.split('/');

Ideally, we should get this from our router already split into an array or something of that nature. I don't like relying on string splitting in order to get a variable from the URL. There's an example of this being done in the blog and blog-post index components.

Remove project timeline

The timeline is no longer relevant considering it's an open source project of (currently) indeterminant direction. Would be better to remove this altogether.

Occasional flash of 404

Occasionally the 404 page is flashing on load. Currently, we've nullified this by making the 404 page a blank page, but this isn't a good solution.

"Brand Guide" PDF is blocked by AdBlock on OpenMined site.

After scrolling to the very bottom of the main page (https://www.openmined.org/, as of April 17th, 2018), and clicking on the "Brand Guide" link, it goes to the following link:

https://www.openmined.org/assets/openmined-brand-guide.pdf

However, initially on this page, I only see the rainbow backdrop used by the rest of the OpenMined website, and nothing else. The label for the tab in the browser is also "Page Not Found | OpenMined". The URL has pdf at the end, but no downloads start.

However, when I turned off Adblock, the PDF was suddenly visible. I believe this is the first time this has ever happened when opening a PDF document in Chrome. Considering that AdBlock (https://chrome.google.com/webstore/detail/adblock/gighmmpiobklfepjocnamgkkbiglidom) is literally one of the most-used chrome extensions out there, perhaps fixing this incompatibility should be on the TODO list.

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.