ilillii/collecobrary

Making online learning fun and easy.

collecobrary's Issues

Computation Structures website not found

As title states, Computation Structures URL redirects to missing website

Improve course sidebar.

What has been done

I've implemented a sidebar to overlay on the digraph. When you hover over a course in the sidebar the node associated with it in the digraph reacts as if you've hovered over the node itself. Additionally, I color coded the courses listed in the sidebar similar to the nodes, making it easy to discern courses by subtopic.

What still needs work

I think it looks kind of bad randomly colored as it is. I suspect it might benefit from being organized into logical subtopics, similar to how you might see courses organized in a university course catalog.

We can change the structure of the data to facilitate this process. I may have to add a numbering system so it is easy to topologically sort courses into a logical sequence within subtopics.

To do

Clean up the sidebar and make it easier to parse visually, possibly incorporating the ideas mentioned above.

Organize new subjects

I added a few subjects that I am familiar with, but as I was trying to add 'Math' I realized I had ventured out of my wheelhouse and I could no longer be an arbiter of quality. I simply didn't understand the syllabi or what is taught in a typical university math curriculum, and this was even after reading through several schools' degree requirements.

If you are a subject matter expert and want to contribute, consider organizing a new subject.

This is more involved than other issues, so maybe it is best to contact me and we can talk more about how exactly to do this.

Implement Search Functionality

Implement search functionality so people can quickly search for specific courses.

This could include building a component to be embedded into the homepage that allows search and shows results.

Node hovering on d3 digraph

Right now there is just a tooltip that appears on the nodes on hover. This happens after a slight delay, which leads to a suboptimal user experience.

It would be better if the name of a node appeared immediately on hover and was styled in such a way that it was easy to read.

This would entail modifying the d3 chart function within the DegreeMap.vue component.

Website is Down

The https://curated-courses.herokuapp.com home page is saying "Application Error".

Clean up code

I hacked this project together really quickly and so it is kind of messy.

An improvement would be to refactor the code. Many of the Vue components are mammoths containing multiple things, such as a header, body content, and a footer. We could extract these pieces of code and put them into modular components where possible. This would make the code both more readable and more reusable.

Additionally, I have a lot of methods registered in some components. These walls of code make the component hard to understand. It would benefit from being extracted to a separate file and imported rather than being written in the component itself.

If you wanted to do this, be sure you write good docstrings for the functions so the import makes sense to others; I have written very few comments so far.

Where to start

A good starting point would be extracting the legend. Currently the code for the legend is in the DegreeMap component. We could extract this to its own component and then register this component in the DegreeMap.

Make adding courses easier

Currently when I add a course to the data assets, I add a course description to one file, a node to another file, edges describing prerequisite relations in another file, and finally add the course into a subject listing.

This is kind of complex to just add a simple course and it makes contributing a little more difficult as well as error prone. I think we can improve this.

If you have a good idea for how to do this, feel free to implement it.

Otherwise, I was considering a few options.

First, we could consolidate the datasheets into a single file so each course datum includes its description, prereqs, and node information. This would simplify things, but then we would have to change the parsing logic to algorithmically build the edges, nodes, and description data structures on page load.

Alternatively, we could write a script that you could run to add a course where it then writes the course information to our four separate jsons.

Any thoughts?

Mobile Friendliness

Right now the app is not mobile friendly at all.

I wasn't sure of the best way to make the digraph look ok on mobile so I didn't even do it.

If anyone wants to tackle this problem, that would be really helpful.

Users

We need to get some users and we need to get some feedback.

Any ideas?

Refactor d3 digraph code

Right now the d3 digraph code is embedded in the DegreeMap.vue component.

It is not very clean and I think it would be better if we refactor the code to be a separate script.

This would help in case we want to use the digraph in another place.

New Name?

Should this repo be renamed to something better?

Add courses to dataset

A good way to help is to add high quality courses to the dataset. You can view contributing.md to see exactly how to do this.

Update course descriptions

I added a number of courses to the website and created excellent descriptions for some of them. However, as I continued to add more courses I started to get lazy with the descriptions and just put one-liner placeholders. These could be updated.

If you choose to update any of them, here is some guidance:

First, course descriptions are located in assets/descriptions.json and are structured as follows:

1. The top part of a description is a generic description that describes the course content. What does the course cover, who should take it, what do you learn, where do you go next, etc.
2. The bottom part of a description is a source specific description that describes details specific to the individual course. Where can you find materials, are there lecture videos, when is the course from, do they update the course website annually, etc.

Now, to update a description, here are some tips:

1. Read the syllabus to see what the course covers. Put this in the generic description, but don't just copy and paste because syllabi aren't always written well. It may take some synthesis if the generic course has multiple specific courses under it, because it is unlikely that the courses all teach identical subject matter. You may find that these are not actually equivalent and then we can restructure the curricula, but if they are sufficiently similar we just want to describe the archetypal course. The goal is for learners to quickly and easily understand how the course fits in the curriculum so they can decide if they want to take it.
2. The course-specific description is where you can detail what makes this course different from the generic descriptions and also include what kind of materials are available and where to find them. Additionally, you can pass a subjective judgement and mention the quality of the course, but you should only do this if you have spent a decent amount of time looking at it, such as actually taking the course.

Possible Improvements

Do you have any ideas for possible improvements to the app?