Using Glitch for education — an experience report

Ok, it’s not exactly the editor, it’s more like “everything”. The project (I mean the *.glitch.me link) starts showing either 403 Forbidden or “too many requests to the project”.

Actually I’m not sure if the editor itself (saving etc) is rate limited. I don’t remember already. But the project is.

ah I see, thanks for the clarification

makes sense that it’s more suitable to spread out the requests across individual student projects. I’m seeing from Glitch’s restrictions page that the limit is 4000/hr. which if, as you say, everyone’s preview refreshes when anyone types, would get worn out pretty quickly.

maybe a workaround for both problems, the state resetting and the rate limit is to have students close the in-editor preview and open a preview in a new tab, which seems not to refresh automatically.

live reloading is nice for certain kinds of development though, but so is having the instructor see everyone’s work in one editor. hm :confused:

Sharing in case it helps, you can also turn off auto-refresh in the project settings on the left of the editor!

1 Like

The cool thing about having everyone work in one project is that I never ever hit the problem that “oh, this is not my account” or “whose account is this” at the start of the lesson, and it’s also super easy for the kids to check each other’s code — or help each other — because it’s all in the same sidebar.


Btw I have another tiny experience report after doing a session w/ two ten-year-old kids today: the situation with auto-closing tags is worse than I thought. Here is the exact sequence that one of the two kids was using time after time to wrap a word into <i> </i>:

  • Type <i> at the beginning of the word.
  • Delete the auto-typed </i>.
  • Move to the end of the word.
  • Type <i>.
  • Delete </i>.
  • Type /. Now they have </i>i>.
  • Delete i>… or just not notice it and keep going.

I pointed out that “you can do better” but a) the kid just shrugged it off and b) they can’t even type well (don’t know where " and <> are on the keyboard, don’t know how to add or delete an empty line) and I’d rather not pile up even more stuff on them.

Again, if I was making a platform specifically for my own needs I would add an option to disable auto-closing tags, because so far out of 15 students I can’t recall many who were proficient with those.

I will admit that I’m currently really tempted to spend a week building a HTML pastebin specifically for education, but so far I’ve successfully stopped myself from doing that. (If somebody knows anything like that, I would appreciate any pointers!)

After much tinkering, it looks like disabling the auto tag closing after codemirror initalizes is a bit tricky, but it can be done by removing the keymap.

document.querySelector(".CodeMirror").CodeMirror.removeKeyMap("autoCloseTags");

kudos to whoever on the glitch discord reminded me that the codemirror object is still accessible even though glitch is a react app with almost no variables in global scope.
it’s probaly inconvenient in an education setting, you have a couple of options

  • Write a chrome extension to apply this and install it on each computer you’re going to use. Not actually sure how to do this but I believe you’d use a content script.
  • Make a “bookmarklet”! In chrome, start by making a bookmark of any page, then click “more” and change the url to the above script with javascript: prepended to the start. Now in order to apply the script, you’d have to click that bookmark every single time the editor loads.

The reason this doesn’t end up breaking due to CSP like the glitch chat collaboration is because the code is relatively small so it can fit in the entire url section of a bookmarklet. A chat program is a more complex than this tweak so it cannot necessarily fit within the url section of a bookmark. So people get around this by creating a “bootstrap” bookmarklet that actually loads the real script from a domain. That domain, gets blocked by csp.

4 Likes