thegraidenetwork / rubric-creator Goto Github PK
View Code? Open in Web Editor NEWA free tool to help teachers create custom rubrics
Home Page: https://www.rubriccreator.com/
License: Apache License 2.0
A free tool to help teachers create custom rubrics
Home Page: https://www.rubriccreator.com/
License: Apache License 2.0
I've done some basic checks on this, but would love help with more in-depth coverage making sure this app works well for users with accessibility issues.
I'm not sure what would be involved in this, but I imagine teachers in other countries could find this project useful. I would like help learning how to go about internationalizing this app and translating it if there's a need.
We should use a dynamic component to insert the current year in the footer rather than the hard-coded 2018
we're using now.
Once done, we'll never have to come back to change the date in Rubric Creator's footer. 🙌
getYear
will probably work: https://www.tutorialspoint.com/javascript/date_getyear.htm
Allowing users to share rubrics with others in the community would be a great way to let teachers help other teachers. Some concerns:
Initial goals for the project:
Part of using this tool as a marketing device means we need Google to crawl the main pages and individual rubrics (at least the public ones) we host there.
Currently all rubrics (defaults and those the user accesses or creates) are included in their list. We'd like to allow users to clean that list up by removing rubrics they no longer need.
Shouldn't be too hard as the app is small and pretty early in development. Here' an upgrade guide: https://update.angular.io/
Adding more end-to-end tests to the suite.
These tests help prevent regression and ensure that our core functionality is working before pushing updates.
Tests we still need:
There are probably more we could add. Existing end to end tests can be found in this file.
https://github.com/thegraidenetwork/rubric-creator/network/alerts
Mostly this will just require updating our dependencies, but we'll also want to carefully check any breaking changes in packages.
Use Angular's Meta service.
In addition to creating rubrics from scratch, we would like to allow users to duplicate and edit an existing rubric.
Upgrade Rubric Creator to Angular 7/8, ngrx 7/8, and Typescript 3.1.
Now that we don't rely on rxjs-compat
we should have a clear upgrade path to move Rubric Creator to Angular 7. This is great practice for our production app (we're still running it on Angular 6 and need to upgrade sometime this year), and it will ensure we keep this project up to date.
Upgrading Typescript can be done after Angular, but I don't think you can upgrade Typescript before Angular. Ngrx might need to be done at the same time as Angular.
Ensure that deleting multiple rubrics in a row works as expected.
This is a pretty common behavior, and it appears to be broken.
While I have not verified this, my guess is there is some sort of bug in the state management system for deleting rubrics which only deletes the most recently deleted one. If you delete one rubric, refresh the page, then delete the second, it works as expected.
Removing this project's dependency on RxJS-Compat. This library is meant as a middle step when migrating from RxJS 5 to 6. When we upgraded to 6 we installed it so we could continue using the old method of chaining observables.
Apparently we could package this up to be released in the Apple and Android app stores if there's desire?
The Total Points
shown at the bottom of the Rubric Create/Edit page reflects the sum of all levels in each component. It should reflect the sum of the highest level in each component. This should be fixed.
Fixing it prevents confusion, and it's an obvious bug.
It looks like the bug is in the getTotalPointsFromRubric
function. This should be updated along with the unit test (which is passing).
There should be an alternate view for creating rubrics when on mobile.
The rubric creation page is not mobile-friendly.
The latest e2e test run failed in Codeship: https://app.codeship.com/projects/95a16760-27a5-0136-f837-6ef2b9ae3ded/builds/5a7b2e1f-9030-47d4-938b-c14892323c7e?step=serial_parallel_ng_e2e
The error:
[14:40:49] E/launcher - session not created: Chrome version must be between 70 and 73
2019-01-08 14:40:49
frontend
(Driver info: chromedriver=2.45.615279 (12b89733300bd268cff3b78fc76cb8f3a7cc44e5),platform=Linux 4.4.0-1013-aws x86_64)
2019-01-08 14:40:49
frontend
[14:40:49] E/launcher - SessionNotCreatedError: session not created: Chrome version must be between 70 and 73
2019-01-08 14:40:49
frontend
(Driver info: chromedriver=2.45.615279 (12b89733300bd268cff3b78fc76cb8f3a7cc44e5),platform=Linux 4.4.0-1013-aws x86_64)
2019-01-08 14:40:49
frontend
at Object.checkLegacyResponse (/angular/node_modules/selenium-webdriver/lib/error.js:505:15)
2019-01-08 14:40:49
frontend
at parseHttpResponse (/angular/node_modules/selenium-webdriver/lib/http.js:509:13)
2019-01-08 14:40:49
frontend
at doSend.then.response (/angular/node_modules/selenium-webdriver/lib/http.js:440:13)
2019-01-08 14:40:49
frontend
at <anonymous>
2019-01-08 14:40:49
frontend
at process._tickCallback (internal/process/next_tick.js:188:7)
2019-01-08 14:40:49
frontend
From: Task: WebDriver.createSession()
2019-01-08 14:40:49
frontend
at Function.createSession (/angular/node_modules/selenium-webdriver/lib/webdriver.js:777:24)
2019-01-08 14:40:49
frontend
at Function.createSession (/angular/node_modules/selenium-webdriver/chrome.js:709:29)
2019-01-08 14:40:49
frontend
at Direct.getNewDriver (/angular/node_modules/protractor/lib/driverProviders/direct.ts:90:25)
2019-01-08 14:40:49
frontend
at Runner.createBrowser (/angular/node_modules/protractor/lib/runner.ts:225:39)
2019-01-08 14:40:49
frontend
at q.then.then (/angular/node_modules/protractor/lib/runner.ts:391:27)
2019-01-08 14:40:49
frontend
at _fulfilled (/angular/node_modules/q/q.js:834:54)
2019-01-08 14:40:49
frontend
at self.promiseDispatch.done (/angular/node_modules/q/q.js:863:30)
2019-01-08 14:40:49
frontend
at Promise.promise.promiseDispatch (/angular/node_modules/q/q.js:796:13)
2019-01-08 14:40:49
frontend
at /angular/node_modules/q/q.js:556:49
2019-01-08 14:40:49
frontend
at runSingle (/angular/node_modules/q/q.js:137:13)
2019-01-08 14:40:49
frontend
[14:40:49] E/launcher - Process exited with error code 199
When I ran the e2e tests locally using node, there was no issue, so I suspect it's a problem with the Docker Image we're using.
EG: https://www.rubriccreator.com/rubrics/5bcf85a7baccb064c0b97866
I think this is a Bootstrap issue, but we'll have to figure out how to get around it or just hide the descriptions on mobile.
Allows us to see which features are being used as well as track new rubrics created by users.
Remove the Intercom Javascript snippet
We no longer use it.
Search for intercom
within the app and remove any references or imports that use that file.
The only noticeable difference should be that the Intercom code should be gone. It's already been disabled from the admin panel.
Adding a loading indicator before a remote rubric is shown.
When loading an individual rubric that a user doesn't have saved to their machine, it shows an empty page but no indication of loading.
While retrieving the rubric from JSONbin, show a loading indicator
In addition to supporting offline access, a PWA would allow users to add the app to their home screen for easy access.
Currently if a user comes to the site, the "core" rubrics are saved to local storage. If we update the list of core rubrics in the app, the user won't see the new "core" rubrics unless they clear their localstorage.
This isn't ideal as it means we can't change these core rubrics easily for all users.
We currently don't run these automatically in Codeship, but should.
Adding a search feature to the rubric list
When users have many rubrics, a search feature can help minimize the time spent looking for the right one.
We want users to know they can share or save their rubric link for permanent access. Sharing buttons would encourage this, and might be an "MVP" for public rubrics.
Allowing users to "favorite" rubrics.
Some users may have many rubrics, so it would be great if they could mark the ones they use most often by "favoriting" them.
Ideas for this include:
This would help teachers sort through their own rubrics or (in the future) help their public rubrics be more searchable by other teachers.
We currently have 83% unit test coverage in the rubric-creator project. We would like to be at 90% overall test coverage for this project if possible.
High unit test coverage ensures that other developers can work in the project without breaking functionality. It also demonstrates our commitment to unit testing to future job candidates.
In order to see the code coverage report locally (this will speed up your process), you can generate it by running the tests with code coverage enabled:
ng test --watch=false --code-coverage
The code coverage files will be added to the /coverage/index.html
file, which you can open in Chrome to view.
Improving the unit test coverage will just mean drilling down into the classes/methods that are not well-tested and adding more coverage where possible.
Currently the deploy URL and other prod build variables are hard-coded into the prod Dockerfile.
I believe this can be done with Codeship's encrypted build args
There should be an alternate view for creating rubrics when on mobile. We have a similar "alternative" view for viewing rubrics on mobile, so you may want to look at that.
Creating a rubric in our current mobile view is cumbersome because you have to horizontally scroll a lot.
When creating a rubric with multiple components, updating the level score for any components updates all component level scores in the same vertical alignment.
Rubrics should be able to weight different components at different point levels.
When adding new levels, the new level should be created with the same level scores as the most recently created level. Once levels have been created, the scores should be able to be updated without modifying other level scores.
Would be great to have automated test coverage reporting for unit tests.
Some docs that might be relevant:
The single rubric page (/rubrics/:uuid
) doesn't work well on mobile, especially for rubrics with many levels. I think that this could be turned into an accordion style layout at a certain max width.
Right now custom rubrics are stored on the user's browser and in JSONbin, but we don't store the ids of those JSON files, so if the user resets their cache, there's no way to recover them. We might also want to know more about the rubrics our users create to see what they're using the platform for.
Adding a message to offline users telling them to reconnect if they're visiting a specific rubric page, but they're currently offline.
Currently users who are offline may try directly navigating to a link to a rubric they haven't downloaded. This will throw errors. We should instead show them the "offline" component.
The tricky part about this is we don't know if the rubric they're requesting exists or not. So, I think the logic should be something like this:
Would allow users to:
It would add complexity though as we'd have to implement a new server-side app to handle authentication.
Live chat (eg: Intercom) would allow us to engage with users, get feedback, and collect leads for our business.
Rubrics created on our primary web application cannot currently be exported to rubriccreator.com and vice-versa.
Exports to tgn would allow teachers to create rubrics and easily import them into the web app if they join as customers. Imports from TGN might allow admins to update default rubrics more easily (see #39).
The default rubrics that all users get access to will need to be updated somewhat frequently. Unfortunately, they are currently hard coded. There needs to be a simple but secure way to add a new default rubric.
Badges to add:
Adding more end-to-end tests to the suite, specifically to test the behavior of the app when used ofline
These tests help prevent regression and ensure that our core functionality is working before pushing updates.
Initial test we need:
There are probably more we could add. Existing end to end tests can be found in this file.
Explanations and examples of different means for testing service workers can be found here: https://medium.com/dev-channel/testing-service-workers-318d7b016b19
The goal is to allow users to use as much of the app as possible while offline, and make sure any online-only features degrade gracefully.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.