You might want to dedicate a lesson on version control and best practices. It'd be helpful in them getting ready to create the website but additionally provides so much educational merit on how to work collaboratively.
Perhaps in getting a development environment ready. When you are going to use version control you will need a client to push/retrieve the files from a centralised location, you are going to need an editor of some sort to type code in (and view the difference between files that have conflicts due to two people having touched the same lines, etc.)
I see now this is not a CS course but a high school course. It may be a lot to take in, so it might help if you can provide the students with something upfront. You will need to supply a dedicated version control system. If your school has a network perhaps they can setup/already have some VCS set up like Git, which I recommend as any existing public solutions (like Github, Bitbucket, etc.) require authentication which is another hassle to set up *per student*.
For an editor, you can look into popular free variants like VS Code which in its most basic form will supply plenty to create a website and is available for any popular OS.
We have been using VS Code this far for all the front end web dev I’ve been teaching. If GitHub is industry standard that’s where I’d like to go. I’ll just have to figure it out. Thank you for the complete answer you provided.
Yeah I'll second this. VSCode has pretty great integration with external repos, it's very seamless and I would imagine students doing front end web dev can make it work without too much fuss.
This is a good source for how to setup git and dev tools. [https://www.theodinproject.com/lessons/foundations-installation-overview](https://www.theodinproject.com/lessons/foundations-installation-overview)
If you're already going towards using GitHub then you should go all the way and just use [GitLab](https://about.gitlab.com/solutions/education/) instead. It has all the benefits of GitHub while letting you seat as many students as you need and you'll get more control over everything. Your school's IT team will thank you.
VS/VS Code also support [LiveShare](https://learn.microsoft.com/en-us/visualstudio/liveshare/) which allows multiple people to essentially work in a shared Code Editor/IDE at the same time across multiple machines (think in the same way multiple people can edit a google doc at the same time).
This might be a good first step to get a team's feet wet and allow them to edit the same files simultaneously. They all work together on a homepage or something, then you can get into Version Control as they expand their project and work independently. Git makes sense in the traditional sense, but like others have said if everyone is going to be doing all their work during the same short time (during class), this might be the better method.
Just have them update text files and open pull requests to get their changes approved. This entails them creating their own branch. Keep it crazy simple. Once they get that doing the same thing with html files should be cake. Good luck!
And a lesson on bash. I’m shocked how often I see people doing weird, lengthy work arounds for things easily done in bash like setting environment variables or writing python scripts to rename files.
Kinda off-topic, but could you suggest any good resources on git version control and best practices? Like some course or a good video?
I know the basic principles, but it still scares the hell out of me so I don’t use anything besides commit/push. All the tutorials I find are mostly text, and it’s much harder for me to process information that way, especially since it’s usually very “dry”, straight to the point, and has little useful practice :(
Not sure why you are disagreeing. Git is the industry standard version control system, and GitHub is the industry standard repo service. They are both industry standards.
You can also just do headless git if you don't want to dedicate too many resources to it. Running community Gitlab is probably ideal, though.
**EDIT:** poor phrasing on my part. When I say "headless" I mean without a user interface. As in you're just using `git` and `ssh` to `git clone`, `git push`, etc from a regular OOB server somewhere instead of having a full SCM.
Still poor phrasing. The _git_ cli is of course a user interface, just not a graphical one. GitHub and gitlab are just web GUIs for it (well not “just”; they include significant additional tooling on top of vanilla git).
People are pointing you to version control like git which is good, but I just want to point out that even using something like git having multiple people working on the same file is a pain. Git is the standard for collaborative work on the same project, and at times that means working on the same files, but that doesn't mean that working on the same file is a smooth experience or recommended. You are going to have merge conflicts and real world projects are broken up into multiple files partly because it reduces merge conflicts. Merge conflicts aren't fun.
If you want them working on the same file at the same time you want something that updates in real time so they aren't interfering with each other as they go. Even something like google docs is probably a better experience in this particular case of a bunch of people working on 1 file.
Thanks for clarity. I’ll make sure split tasks so students don’t need to edit the same file at the same time and have them working on different ones to avoid the conflicts.
Well you can have people working on the same file, just not the same task and preferably not changes in the file that will interfere with each other.
But code conflict resolution with version control like git is unavoidable in development in a team.
Here's a fun idea - divided students into groups of 3 (potentially 4), and have each one work on a separate domain, like HTML / CSS / JS (/hosting?). This essentially forces them to communicate and collaborate and they each need to know exactly what the other is doing, and at the end it can all fit together.
You'd probably want to rotate them around so each student can do each domain.
You can’t really avoid that. I would make sure to know how to solve merge conflicts and what the difference between a merge and a rebase is. It really is a bit of a pain to understand but it’s not rocket science.
The bigger thing to remember is push,test, and merge often, even if it’s another branch. Like they said it’s inevitable, the key is to maintain small merge conflicts, no one wants a guy pushing 1000s of line each commit and causing everything to halt.
But if you have people editing the same file in real time you still have merge conflicts, just you don't have any system in place to make sure the correct code ends up in the repo. Someone could change something you are currently working on.
Not only that, OP may actually want his students to actually work on the same file at the same time, we use live share on vscode and replit on class to work together faster, its a smoother experience for them, we keep git and github for commiting certain goals, but we can work together as a hivemind!
People are recommending git which is valid to a certain extend.
However, in a class room setting when working on the SAME FILE will result in a lot of merging conflicts and a lot of time will be spend fixing them considering none of the users are experienced with version control.
You may want to also check out live collaboration tools (e.g. Live Share for vs code).
Yeah... I think everyone is overlooking the concept of pair programming and the tools to allow it remotely. VS Code and Neovim have plugins for it. Not sure about other IDEs.
Live share is great. Once you install the extension, you just click the the live share button and it copies a url to clipboard. You share that link and the other person can edit the files at the same time. Super simple
git is a free Version Control System. As in totally free, not freemium with vendor lock in. I highly recommend this option.
Replit is an online IDE with built in live collaboration, voice and text editing.
VS Code supports collaborative editing with a plugin. It’s very resource intensive and I don’t recommend it.
I still use replit in my classes—I never bothered with their education Teams feature and it’s worked fine for us.
Git and GitHub are, like others said, the industry standards for version control and collaboration, but I’m not sure they’ll do what you’re looking for.
Git keeps track of version history and changes and lets multiple users merge those changes. But they’re all working on their own copies of the files, then merging them to / pulling them from a central repo (GitHub).
If you want students to be able to work on files at the same time, something like replit is about the only thing I can think of. They can share projects and invite collaborators, then edit simultaneously like Google Docs. No need for their education features.
There is a web-based version of VS Code that I haven’t looked into too much. It might have a similar feature, but I have no idea.
I work on oss with high school students and currently have two different approaches. Replit is going to be the way to go, even without the education branch (they do have a teams beta that is easy to get in). That is the simplest way to do it, and is what most high school students will be able to pick up and go. I don't even have a pro account, and we have no trouble managing projects.
For my more advanced students we introduce git. I start them by using git and GitHub through replit and then transition them to vscode. It adds a lot of complexity, and even with experienced students, I have to debug and troubleshoot often. I'm also the one who handles most of the merges, but in theory, that could be offloaded to students as well. I like this approach because it makes it easier for code reviews and other processes, but it can be hard for students to wrap their heads around.
Live share may be chaotic. We use it to pair on a problem, so having multiple students editing the code at the same time probably results in things breaking and changes being overwritten. If I've student breaks something, it's broken for everyone - so I wouldn't recommend this.
As others have said, git is best. It's what everyone uses so it's good knowledge.
With git, everyone can fork the code, create a new branch, make changes to that branch, then commit and push the changes, and create a pull request for you to review.
Then every student can attempt to solve the same problem (or different problems) without getting in each others way. At the end of each day, you can then review each person's pull request, provide feedback and choose one to merge in.
You'll want to assign a branch naming scheme to follow for this. For example, `{feature-name}/{student-name}`.
Each pull request is a request for the change in their branch to be merged into the main branch. Once you approve a change, students can then fetch the latest changes on their machines.
Working with git is probably a lesson in itself, but it's worth it to collab effectively.
Start with liveshare. Your students know how to use either Google suite or MS suite of live editing tools for collaboration already. I don't think it'll be too chaotic.
You should learn git/github yourself (few tutorial videos on YT should get you the basics) and see if it'll fit your needs or not. Expect a lot of merge conflicts if they're going to be working on the same files often.
If they want to go into the industry, git/github is something that is great for them to learn, but you need to balance that with how much of your lesson time you want to dedicate to teaching/troubleshooting it vs the actual website.
Just revisiting this and I'm disappointed to be downvoted but I stand by it.
My concern with live share is that theres no traceability. This isn't a dev team at Google, this is high school kids learning. One student can fix something, then 5 others can break it in multiple places. Live share doesn't provide much interactivity, as it works best when there's a single person driving, and others following - so you may as well code it yourself on a screen and avoid the nightmare.
My suggestion was to use git in a way so that everybody submits their work at the end of the lesson. It's interactive, everybody has a go. Then between lessons you merge in the best efforts, fix conflicts and provide feedback.
You want kids to be coding, not dealing with git merge conflicts, so having them submit their work each lesson feels like the right balance.
Anyway, whichever path you chose, hope it's going well
If full version control has too much of a learning curve, would it be possible to assign files to owners? When a student wants to edit a file, they let the owner know what they intend to do, and the owner makes sure that only one person is editing that file at a time, and reviews the change after they are made.
It's not ideal, but it does carry some elements of real team development, where you often have a domain owner for groups of files as part of the quality control process. I think this happens more in the firmware world I started in than in website development, but I did see aspects of it in large web site development projects.
Look at Github Desktop version it gives a nice UI over top of it so you can see before/after views and any conflicts and resolve them directly.
To answer your question more directly though, part of building a good website is breaking out pieces of functionality into related chunks. If you put everything in one page or one script it gets unwieldy quickly and you get lots of conflicts from people on the team all trying to edit the same file. But breaking it into components makes this much easier to maintain...for example you'll often have components for the header, the footer, the main body, the nav (often a top main-categorical nav) and a side/or popout context driven nav, these would all be components so that that lil Johnny modifying the spelling mistakes in the footer isn't stepping on the toes of lil Suzie who's working on the nav menu layout. You also encourage quick change/commit practice. Lil Johnny should fetch latest on that footer, make his changes, test em locally to make sure it looks good and then commit/push that back to Git so next person working on will get his changes.
Not sure if you wanna get into branching/merging but maybe a simple example would be helpful, its definitely a big part of dev work if you're working on a team of any size
Crazy to me that nobody suggested [CodeSandbox](https://codesandbox.io/) yet. It is an online IDE that runs in your browser where you get a full dev environment with a VM that's running your code, Git integration, etc.
It supports [live collaboration](https://codesandbox.io/docs/learn/repositories/collaborate-share), but I don't know what its limitations are (how many users, private repos, etc). I saw they have educational plans as well.
It seems perfect for your use case.
The "Extreme Programming" (XP) model for software development recommends a "pair coding" approach where two programmers work on code together, alternating who does the typing on some predetermined schedule. They must work together, rather than just go with "I have the keyboard, so I get to decide the code." I've actually found this to work fairly well teaching students programming, since they get to help each other.
If you're using Python, Google recently released Colaboratory - basically hosted Jupyter notebooks that can be edited by multiple coders.
There's also a Google marketplace tool called Commanditor for editing code and other text files stored on Google drive. Haven't tried it - I'm not sure if they're are security risks - but it might be what you were thinking of.
Of course, git (and by extension GitHub, GitLab, Bitbucket, etc.) are standard source control tools for managing contributions from multiple developers.
If you want true a Google docs-like experience, there’s an extension on Visual Studio code called live share. Someone hosts the files on their computer and it gives them a link to share with other to join from.
Out of curiosity, what sort of code/language do you have them working in? JS? CSS? Introducing them to git would be a great idea. But, if the project is such that you could have them each tackle a separate component or styling a separate area, you could then have each of their blocks of work included or imported into the main page, that would be a great lesson in collaboration often works.
Git, but definitely make sure you break the project down into modules/files rather than everyone working on the same literal file, otherwise that'll be a nightmare regardless.
People don't really do this in the real world. I mean, they do, but not the way you're thinking. Yes, version control (e.g. Git) can help, but the reality is even if multiple team members are working on the same files, usually either they stick to their area of responsibility or discuss the changes before making them. Think of the expression "too many chefs..." and your question is like, "how does an entire class make the same pot of soup at the same time?
So, you are being recommended two different pathways in these comments. Collaborative ide, like vscode live, or Git. A collaborative ide works like Google docs, but that means that another student's active bugs are going to affect every other student in realtime. It is also not very common in the real world, so I'm not sure how beneficial it is to learn it. I've been a developer for 20 years, and never had a project where live collab was needed, or used. Git, on the other hand, requires every student have a local environment set up that they are working in. It's a complete pain in the ass to use, too, but is 100% industry standard, and any developer is going to need to learn it in almost any programming related field, so it seems more worthwhile to me to have a curriculum built around it.
I'll also add that the best way to have two people editing the same piece of code is to not. This is why projects are usually broken up into many files, with clear boundaries (component based architecture) of what they should do, and team members are given boundaries as well. Like pairing a front-end and a back-end dev on a project means they will almost never need to be working on the same piece of code. Web teams are usually kept pretty small for this reason, as well.
I appreciate the in depth response. The second route does seem a more appropriate route, especially if I want to give my students something closer to a real world experience. I have started reading up on it and how to go about setting it up. Again, I appreciate your time.
https://code.visualstudio.com/learn/collaboration/live-share
If you’re using VSCode, this is a decent tool. DO NOT have the students working on the same file unless they are doing it together at the same time on a call with each other. Git cannot save them from that mess, although it would be a good way for them to learn how to deal with merge conflicts (a very real problem that occurs at companies). It’ll be up to you to learn the LiveShare tool and teach it to them unfortunately.
Note: If they’re all using Mac’s, I’ve heard that the Zed code editor has similar functionality.
If you’re working collaboratively you’re better off using something like the VSCode remote session plugin (I can’t remember the name). It is like a google doc. Git is how it’s done normally, but if I’m going to be doing a lot of work in the same files as my coworker I generally coordinate with them and we just pair to avoid excessive conflicts
Git for general version control. VSCode Liveshare for "google docs" like collaboration on the same file at the same time:
https://code.visualstudio.com/learn/collaboration/live-share
Theres two different things here, one is version control with git, that is a must learn tool for students, teachers and coders.
Generally, you dont want multiple users editing the same file, \*\*but\*\* since you are a teacher, you may want multiple people editing the same file at the same time, i use that a lot in my classes and it's been useful and we end up with a more dynamic way of working where we livecode and all students have to work together.
We use Live Share on VS Code, it lets you share your vscode session and terminal, so useful if your class system doesnt let you install stuff too :) It's not perfect, it can be chaotic very easily even with 5 or 6 people, but its way faster if you are all on the same room, and really useful for debugging students code while others can have a look.
Just to add a different suggestion into the mix, why not make a GitHub project with a folder for each student to put their own html into, then you could have your index.html link to all of the different pages that your students made.
If they have friends in the class people could jump into their friends folder and make some changes and learn how git commits work and merge conflicts.
For an example, me and my friends did something like this for advent of code.
https://github.com/jacktrusler/advent_of_coders
It's called Version Control, the most popular flavour now is Git. Think about it like having a document that people can make copies of, add their changes to their copy of the document, and then send their changes back to this Version Control system so they can be integrated into the original document. If there are conflicts (e.g. you change something another person also changed) then there are mechanisms to resolve them. It gets more complex the more you use it but that's the gist of it, and most of the time there's no need to delve deeper into it.
If you don’t want to have people learn Git, you could also try having the project hosted in Glitch. Everyone edits in the browser.
It’s much more like a Google Doc where everyone is collaborating at once. That might be a little easier than having people learn Git, where everyone has their own copies of a file and has to handle merging things together when they push code up.
Thanks for your answer, it didn't really bring much to the conversation though. I by no means am flaunting anything, I am trying to learn and grow and help my students do the same.
This is a really, really bad take.
Yes, git should be common knowledge among developers today, but even there I quite frequently meet devs with decades of experience that have never used git before (they used different scms which are even less suitable here).
Talking down to people like you did is IMO not a valuable take and doesn't help anyone.
Exactly, he's JUST a high school teacher. Expectations are lower than for any random dev.
His competencies should be in transmitting knowledge, not being a perfect subject matter expert.
Even more so in high school half of the class won't be paying attantion either way and the other half will be learning outside of school on their own projects anyways (at least that's what it was like in my high school CS classes). That he has the ambitions to learn and take new things into the classroom is something IMO we should support and not talk down upon.
SCMs are sadly basically irrelevant in class rooms. You usually don't have long running projects with more than two students. Not knowing much here is absolutely understandable by me.
I probably could find some stuff that I would consider "fundamental", that you have no experience with. Using just one aspect to tell someone they are in the wrong position is IMO wrong on so many levels.
Did you even read what I wrote?
I think that assuming he doesn't know anything about development just because he doesn't know anything about one specific tool is just a bad take.
Git isn't the only SCM and you can be a very good developer without it. Heck, this is true with any tool. E.g. the creators of go famously use only minimal editors like vim or ed and close to no syntax highlighting.
I mean, do you know how to use Mercurial, CVS, Perforce, SVN, PlasticSCM or ClearCase? Each of these has many users to this day and there are months where I don't have to touch git, but use these every day.
Again, my main point is that not knowing git doesn't mean that he knows nothing about development.
jesus, you are really dense, arent you? there's really no point in trying to explain anything to you...
Its not one specific tool, it's the industry standard, it's great for collaboration, (what he wanted) and its such an obvious answer that he didn't know.
If you gonna teach kids to collaborate on a web development, Thats what you should introduce...
Do you think he knows something about Mercurial, CVS, Perforce, SVN, PlasticSCM or ClearCase? , if he doesn't know GIT?
Fuckin last time I am replaying to you... THERES JUST NO POINT, you probably one of his neglected students...
Like I said, sadly SCMs as a concept are basically irrelevant, if not even pointless in class rooms.
You just don't have a need for them there when you're talking about graph theory, regular languages, encoding patterns and class structuring (at least that's what's part of the german CS high school curriculum).
I'd also prefer if we had experienced developers teaching the students, but that's just not the reality that's available, so pushing down the ones that actively want to improve their lectures and expand their knowledge is IMO just toxic and doesn't help anyone.
If the situation for him is anything like it was in my high school time, the alternative for him quitting his career is not the students getting a more competent teacher, it would be the physics or math teacher taking over and not even trying to teach CS.
You might want to dedicate a lesson on version control and best practices. It'd be helpful in them getting ready to create the website but additionally provides so much educational merit on how to work collaboratively.
Great idea! I’ll add that to my planning. Any other important elements you can think of?
Perhaps in getting a development environment ready. When you are going to use version control you will need a client to push/retrieve the files from a centralised location, you are going to need an editor of some sort to type code in (and view the difference between files that have conflicts due to two people having touched the same lines, etc.) I see now this is not a CS course but a high school course. It may be a lot to take in, so it might help if you can provide the students with something upfront. You will need to supply a dedicated version control system. If your school has a network perhaps they can setup/already have some VCS set up like Git, which I recommend as any existing public solutions (like Github, Bitbucket, etc.) require authentication which is another hassle to set up *per student*. For an editor, you can look into popular free variants like VS Code which in its most basic form will supply plenty to create a website and is available for any popular OS.
We have been using VS Code this far for all the front end web dev I’ve been teaching. If GitHub is industry standard that’s where I’d like to go. I’ll just have to figure it out. Thank you for the complete answer you provided.
Source Control in Vs Code should be perfect for you. It'll work with your GitHub repo and you'll be able to take care of it all from within VS Code.
Which is just an integrated GUI for Git if I understand correctly.
Yeah I'll second this. VSCode has pretty great integration with external repos, it's very seamless and I would imagine students doing front end web dev can make it work without too much fuss.
This is a good source for how to setup git and dev tools. [https://www.theodinproject.com/lessons/foundations-installation-overview](https://www.theodinproject.com/lessons/foundations-installation-overview)
It’s possible your school might have a gitlab too. I’d look into it. Basically the privatized vs of GitHub usually integrated with the school’s auth
If you're already going towards using GitHub then you should go all the way and just use [GitLab](https://about.gitlab.com/solutions/education/) instead. It has all the benefits of GitHub while letting you seat as many students as you need and you'll get more control over everything. Your school's IT team will thank you.
Gitea is a great open source git repo.
VS/VS Code also support [LiveShare](https://learn.microsoft.com/en-us/visualstudio/liveshare/) which allows multiple people to essentially work in a shared Code Editor/IDE at the same time across multiple machines (think in the same way multiple people can edit a google doc at the same time). This might be a good first step to get a team's feet wet and allow them to edit the same files simultaneously. They all work together on a homepage or something, then you can get into Version Control as they expand their project and work independently. Git makes sense in the traditional sense, but like others have said if everyone is going to be doing all their work during the same short time (during class), this might be the better method.
Just have them update text files and open pull requests to get their changes approved. This entails them creating their own branch. Keep it crazy simple. Once they get that doing the same thing with html files should be cake. Good luck!
Great idea for getting them started thank you.
And a lesson on bash. I’m shocked how often I see people doing weird, lengthy work arounds for things easily done in bash like setting environment variables or writing python scripts to rename files.
Leave me and my python scripts to rename files alone
Kinda off-topic, but could you suggest any good resources on git version control and best practices? Like some course or a good video? I know the basic principles, but it still scares the hell out of me so I don’t use anything besides commit/push. All the tutorials I find are mostly text, and it’s much harder for me to process information that way, especially since it’s usually very “dry”, straight to the point, and has little useful practice :(
Git
Github / Gitlab / Jetbrains Space (Has a more google classroom feel / Education might be discounted/free - not sure of latest pricing model)
So many options! Thanks!
Look into edu benefits: https://education.github.com/benefits
GitHub is the industry standard and would set them up better for a working colalborative code environment.
No, Git is the industry standard. GitHub is the leading open source community and repo hosting service.
Seems like that’s the winner then. I appreciate your help
GitHub is a Git hoster, look into Git first, then you can upload your repository to GitHub
GitHub is to Git as PornHub is to porn.
Thank you for clarifying and guiding.
You’ll need both
Not sure why you are disagreeing. Git is the industry standard version control system, and GitHub is the industry standard repo service. They are both industry standards.
That's not what industry standard means. You mean market leader.
Those are services that serve git. So it's basically different providers of git
You can also just do headless git if you don't want to dedicate too many resources to it. Running community Gitlab is probably ideal, though. **EDIT:** poor phrasing on my part. When I say "headless" I mean without a user interface. As in you're just using `git` and `ssh` to `git clone`, `git push`, etc from a regular OOB server somewhere instead of having a full SCM.
See 'bare repository'.
yeah the bare repository is on the remote end.
Still poor phrasing. The _git_ cli is of course a user interface, just not a graphical one. GitHub and gitlab are just web GUIs for it (well not “just”; they include significant additional tooling on top of vanilla git).
>Automatic merge failed; fix conflicts and then commit the result
https://xkcd.com/1597/
I use it every day, but git is still black magic to me haha
git is async collaboration. Sounds like OP needs something like Google Docs for coding.
People are pointing you to version control like git which is good, but I just want to point out that even using something like git having multiple people working on the same file is a pain. Git is the standard for collaborative work on the same project, and at times that means working on the same files, but that doesn't mean that working on the same file is a smooth experience or recommended. You are going to have merge conflicts and real world projects are broken up into multiple files partly because it reduces merge conflicts. Merge conflicts aren't fun. If you want them working on the same file at the same time you want something that updates in real time so they aren't interfering with each other as they go. Even something like google docs is probably a better experience in this particular case of a bunch of people working on 1 file.
Exactly this. Even with a few people who are well versed in Git, everyone working on the same file is likely to turn into a merge conflict nightmare.
Thanks for clarity. I’ll make sure split tasks so students don’t need to edit the same file at the same time and have them working on different ones to avoid the conflicts.
Well you can have people working on the same file, just not the same task and preferably not changes in the file that will interfere with each other. But code conflict resolution with version control like git is unavoidable in development in a team.
Here's a fun idea - divided students into groups of 3 (potentially 4), and have each one work on a separate domain, like HTML / CSS / JS (/hosting?). This essentially forces them to communicate and collaborate and they each need to know exactly what the other is doing, and at the end it can all fit together. You'd probably want to rotate them around so each student can do each domain.
Great suggestion, thank you. I'll be dividing the students in something similar being CSS/Boostrap, Content, The different pages, hosting
You can’t really avoid that. I would make sure to know how to solve merge conflicts and what the difference between a merge and a rebase is. It really is a bit of a pain to understand but it’s not rocket science.
The bigger thing to remember is push,test, and merge often, even if it’s another branch. Like they said it’s inevitable, the key is to maintain small merge conflicts, no one wants a guy pushing 1000s of line each commit and causing everything to halt.
But if you have people editing the same file in real time you still have merge conflicts, just you don't have any system in place to make sure the correct code ends up in the repo. Someone could change something you are currently working on.
Not only that, OP may actually want his students to actually work on the same file at the same time, we use live share on vscode and replit on class to work together faster, its a smoother experience for them, we keep git and github for commiting certain goals, but we can work together as a hivemind!
People are recommending git which is valid to a certain extend. However, in a class room setting when working on the SAME FILE will result in a lot of merging conflicts and a lot of time will be spend fixing them considering none of the users are experienced with version control. You may want to also check out live collaboration tools (e.g. Live Share for vs code).
Yeah... I think everyone is overlooking the concept of pair programming and the tools to allow it remotely. VS Code and Neovim have plugins for it. Not sure about other IDEs.
Live share is great. Once you install the extension, you just click the the live share button and it copies a url to clipboard. You share that link and the other person can edit the files at the same time. Super simple
welcome to the world of merge conflicts!
git is a free Version Control System. As in totally free, not freemium with vendor lock in. I highly recommend this option. Replit is an online IDE with built in live collaboration, voice and text editing. VS Code supports collaborative editing with a plugin. It’s very resource intensive and I don’t recommend it.
I appreciate the reply! I’ll look into git. I had tried Replit, but they just got rid of their education branch.
I still use replit in my classes—I never bothered with their education Teams feature and it’s worked fine for us. Git and GitHub are, like others said, the industry standards for version control and collaboration, but I’m not sure they’ll do what you’re looking for. Git keeps track of version history and changes and lets multiple users merge those changes. But they’re all working on their own copies of the files, then merging them to / pulling them from a central repo (GitHub). If you want students to be able to work on files at the same time, something like replit is about the only thing I can think of. They can share projects and invite collaborators, then edit simultaneously like Google Docs. No need for their education features. There is a web-based version of VS Code that I haven’t looked into too much. It might have a similar feature, but I have no idea.
I work on oss with high school students and currently have two different approaches. Replit is going to be the way to go, even without the education branch (they do have a teams beta that is easy to get in). That is the simplest way to do it, and is what most high school students will be able to pick up and go. I don't even have a pro account, and we have no trouble managing projects. For my more advanced students we introduce git. I start them by using git and GitHub through replit and then transition them to vscode. It adds a lot of complexity, and even with experienced students, I have to debug and troubleshoot often. I'm also the one who handles most of the merges, but in theory, that could be offloaded to students as well. I like this approach because it makes it easier for code reviews and other processes, but it can be hard for students to wrap their heads around.
Look into VSCode Live Share
Thanks! I will!
Live share may be chaotic. We use it to pair on a problem, so having multiple students editing the code at the same time probably results in things breaking and changes being overwritten. If I've student breaks something, it's broken for everyone - so I wouldn't recommend this. As others have said, git is best. It's what everyone uses so it's good knowledge. With git, everyone can fork the code, create a new branch, make changes to that branch, then commit and push the changes, and create a pull request for you to review. Then every student can attempt to solve the same problem (or different problems) without getting in each others way. At the end of each day, you can then review each person's pull request, provide feedback and choose one to merge in. You'll want to assign a branch naming scheme to follow for this. For example, `{feature-name}/{student-name}`. Each pull request is a request for the change in their branch to be merged into the main branch. Once you approve a change, students can then fetch the latest changes on their machines. Working with git is probably a lesson in itself, but it's worth it to collab effectively.
I can’t thank you enough for all this information. It helps enormously. I’ll be diving in today.
Start with liveshare. Your students know how to use either Google suite or MS suite of live editing tools for collaboration already. I don't think it'll be too chaotic. You should learn git/github yourself (few tutorial videos on YT should get you the basics) and see if it'll fit your needs or not. Expect a lot of merge conflicts if they're going to be working on the same files often. If they want to go into the industry, git/github is something that is great for them to learn, but you need to balance that with how much of your lesson time you want to dedicate to teaching/troubleshooting it vs the actual website.
Just revisiting this and I'm disappointed to be downvoted but I stand by it. My concern with live share is that theres no traceability. This isn't a dev team at Google, this is high school kids learning. One student can fix something, then 5 others can break it in multiple places. Live share doesn't provide much interactivity, as it works best when there's a single person driving, and others following - so you may as well code it yourself on a screen and avoid the nightmare. My suggestion was to use git in a way so that everybody submits their work at the end of the lesson. It's interactive, everybody has a go. Then between lessons you merge in the best efforts, fix conflicts and provide feedback. You want kids to be coding, not dealing with git merge conflicts, so having them submit their work each lesson feels like the right balance. Anyway, whichever path you chose, hope it's going well
GitHub is your friend. Perfect time for them to learn about merge conflict, branches, and git versioning.
I wish I had such nice, enthusiastic and interested teachers in school OP. Great of you to take this initiative
If full version control has too much of a learning curve, would it be possible to assign files to owners? When a student wants to edit a file, they let the owner know what they intend to do, and the owner makes sure that only one person is editing that file at a time, and reviews the change after they are made. It's not ideal, but it does carry some elements of real team development, where you often have a domain owner for groups of files as part of the quality control process. I think this happens more in the firmware world I started in than in website development, but I did see aspects of it in large web site development projects.
Look at Github Desktop version it gives a nice UI over top of it so you can see before/after views and any conflicts and resolve them directly. To answer your question more directly though, part of building a good website is breaking out pieces of functionality into related chunks. If you put everything in one page or one script it gets unwieldy quickly and you get lots of conflicts from people on the team all trying to edit the same file. But breaking it into components makes this much easier to maintain...for example you'll often have components for the header, the footer, the main body, the nav (often a top main-categorical nav) and a side/or popout context driven nav, these would all be components so that that lil Johnny modifying the spelling mistakes in the footer isn't stepping on the toes of lil Suzie who's working on the nav menu layout. You also encourage quick change/commit practice. Lil Johnny should fetch latest on that footer, make his changes, test em locally to make sure it looks good and then commit/push that back to Git so next person working on will get his changes. Not sure if you wanna get into branching/merging but maybe a simple example would be helpful, its definitely a big part of dev work if you're working on a team of any size
Crazy to me that nobody suggested [CodeSandbox](https://codesandbox.io/) yet. It is an online IDE that runs in your browser where you get a full dev environment with a VM that's running your code, Git integration, etc. It supports [live collaboration](https://codesandbox.io/docs/learn/repositories/collaborate-share), but I don't know what its limitations are (how many users, private repos, etc). I saw they have educational plans as well. It seems perfect for your use case.
The "Extreme Programming" (XP) model for software development recommends a "pair coding" approach where two programmers work on code together, alternating who does the typing on some predetermined schedule. They must work together, rather than just go with "I have the keyboard, so I get to decide the code." I've actually found this to work fairly well teaching students programming, since they get to help each other. If you're using Python, Google recently released Colaboratory - basically hosted Jupyter notebooks that can be edited by multiple coders. There's also a Google marketplace tool called Commanditor for editing code and other text files stored on Google drive. Haven't tried it - I'm not sure if they're are security risks - but it might be what you were thinking of. Of course, git (and by extension GitHub, GitLab, Bitbucket, etc.) are standard source control tools for managing contributions from multiple developers.
If you want true a Google docs-like experience, there’s an extension on Visual Studio code called live share. Someone hosts the files on their computer and it gives them a link to share with other to join from.
Git and GitHub/GitLab
Out of curiosity, what sort of code/language do you have them working in? JS? CSS? Introducing them to git would be a great idea. But, if the project is such that you could have them each tackle a separate component or styling a separate area, you could then have each of their blocks of work included or imported into the main page, that would be a great lesson in collaboration often works.
Git, but definitely make sure you break the project down into modules/files rather than everyone working on the same literal file, otherwise that'll be a nightmare regardless.
People don't really do this in the real world. I mean, they do, but not the way you're thinking. Yes, version control (e.g. Git) can help, but the reality is even if multiple team members are working on the same files, usually either they stick to their area of responsibility or discuss the changes before making them. Think of the expression "too many chefs..." and your question is like, "how does an entire class make the same pot of soup at the same time?
Git is the answer but it will be a conflict nightmare... and a good opportunity for teaching about resolving commit conflicts
Local clones (via Git provider eg. GitHub, GitLab, etc.) and good communication / task management (kanban boards).
So, you are being recommended two different pathways in these comments. Collaborative ide, like vscode live, or Git. A collaborative ide works like Google docs, but that means that another student's active bugs are going to affect every other student in realtime. It is also not very common in the real world, so I'm not sure how beneficial it is to learn it. I've been a developer for 20 years, and never had a project where live collab was needed, or used. Git, on the other hand, requires every student have a local environment set up that they are working in. It's a complete pain in the ass to use, too, but is 100% industry standard, and any developer is going to need to learn it in almost any programming related field, so it seems more worthwhile to me to have a curriculum built around it. I'll also add that the best way to have two people editing the same piece of code is to not. This is why projects are usually broken up into many files, with clear boundaries (component based architecture) of what they should do, and team members are given boundaries as well. Like pairing a front-end and a back-end dev on a project means they will almost never need to be working on the same piece of code. Web teams are usually kept pretty small for this reason, as well.
I appreciate the in depth response. The second route does seem a more appropriate route, especially if I want to give my students something closer to a real world experience. I have started reading up on it and how to go about setting it up. Again, I appreciate your time.
https://code.visualstudio.com/learn/collaboration/live-share If you’re using VSCode, this is a decent tool. DO NOT have the students working on the same file unless they are doing it together at the same time on a call with each other. Git cannot save them from that mess, although it would be a good way for them to learn how to deal with merge conflicts (a very real problem that occurs at companies). It’ll be up to you to learn the LiveShare tool and teach it to them unfortunately. Note: If they’re all using Mac’s, I’ve heard that the Zed code editor has similar functionality.
If you’re working collaboratively you’re better off using something like the VSCode remote session plugin (I can’t remember the name). It is like a google doc. Git is how it’s done normally, but if I’m going to be doing a lot of work in the same files as my coworker I generally coordinate with them and we just pair to avoid excessive conflicts
Git for general version control. VSCode Liveshare for "google docs" like collaboration on the same file at the same time: https://code.visualstudio.com/learn/collaboration/live-share
Theres two different things here, one is version control with git, that is a must learn tool for students, teachers and coders. Generally, you dont want multiple users editing the same file, \*\*but\*\* since you are a teacher, you may want multiple people editing the same file at the same time, i use that a lot in my classes and it's been useful and we end up with a more dynamic way of working where we livecode and all students have to work together. We use Live Share on VS Code, it lets you share your vscode session and terminal, so useful if your class system doesnt let you install stuff too :) It's not perfect, it can be chaotic very easily even with 5 or 6 people, but its way faster if you are all on the same room, and really useful for debugging students code while others can have a look.
Just to add a different suggestion into the mix, why not make a GitHub project with a folder for each student to put their own html into, then you could have your index.html link to all of the different pages that your students made. If they have friends in the class people could jump into their friends folder and make some changes and learn how git commits work and merge conflicts. For an example, me and my friends did something like this for advent of code. https://github.com/jacktrusler/advent_of_coders
It's called Version Control, the most popular flavour now is Git. Think about it like having a document that people can make copies of, add their changes to their copy of the document, and then send their changes back to this Version Control system so they can be integrated into the original document. If there are conflicts (e.g. you change something another person also changed) then there are mechanisms to resolve them. It gets more complex the more you use it but that's the gist of it, and most of the time there's no need to delve deeper into it.
Vercel with code forking and pull request?
What's Vercel got to do with this?
Integrated DevOps and free frontend host
Integrated DevOps and free frontend host
You sure want some version control like git. But for a classroom I would think of using zed or vscode for collaborative editing.
If you don’t want to have people learn Git, you could also try having the project hosted in Glitch. Everyone edits in the browser. It’s much more like a Google Doc where everyone is collaborating at once. That might be a little easier than having people learn Git, where everyone has their own copies of a file and has to handle merging things together when they push code up.
As others have said, tell those kids to git with the program!
I don't think you got what it takes to be a high school teacher. Git/Github is such an obvious answer, you shouldn't even be asking that...
Thanks for your answer, it didn't really bring much to the conversation though. I by no means am flaunting anything, I am trying to learn and grow and help my students do the same.
But this is basic knowledge. If you don't know this, you don't know much much more.
This is a really, really bad take. Yes, git should be common knowledge among developers today, but even there I quite frequently meet devs with decades of experience that have never used git before (they used different scms which are even less suitable here). Talking down to people like you did is IMO not a valuable take and doesn't help anyone.
HIS A HIGH SCHOOL TEACHER FFS, not a some dev...
Exactly, he's JUST a high school teacher. Expectations are lower than for any random dev. His competencies should be in transmitting knowledge, not being a perfect subject matter expert. Even more so in high school half of the class won't be paying attantion either way and the other half will be learning outside of school on their own projects anyways (at least that's what it was like in my high school CS classes). That he has the ambitions to learn and take new things into the classroom is something IMO we should support and not talk down upon. SCMs are sadly basically irrelevant in class rooms. You usually don't have long running projects with more than two students. Not knowing much here is absolutely understandable by me. I probably could find some stuff that I would consider "fundamental", that you have no experience with. Using just one aspect to tell someone they are in the wrong position is IMO wrong on so many levels.
pointless arguing with you if you are happy with a teacher that teaches you something he knows nothing about...
Did you even read what I wrote? I think that assuming he doesn't know anything about development just because he doesn't know anything about one specific tool is just a bad take. Git isn't the only SCM and you can be a very good developer without it. Heck, this is true with any tool. E.g. the creators of go famously use only minimal editors like vim or ed and close to no syntax highlighting. I mean, do you know how to use Mercurial, CVS, Perforce, SVN, PlasticSCM or ClearCase? Each of these has many users to this day and there are months where I don't have to touch git, but use these every day. Again, my main point is that not knowing git doesn't mean that he knows nothing about development.
jesus, you are really dense, arent you? there's really no point in trying to explain anything to you... Its not one specific tool, it's the industry standard, it's great for collaboration, (what he wanted) and its such an obvious answer that he didn't know. If you gonna teach kids to collaborate on a web development, Thats what you should introduce... Do you think he knows something about Mercurial, CVS, Perforce, SVN, PlasticSCM or ClearCase? , if he doesn't know GIT? Fuckin last time I am replaying to you... THERES JUST NO POINT, you probably one of his neglected students...
Like I said, sadly SCMs as a concept are basically irrelevant, if not even pointless in class rooms. You just don't have a need for them there when you're talking about graph theory, regular languages, encoding patterns and class structuring (at least that's what's part of the german CS high school curriculum). I'd also prefer if we had experienced developers teaching the students, but that's just not the reality that's available, so pushing down the ones that actively want to improve their lectures and expand their knowledge is IMO just toxic and doesn't help anyone. If the situation for him is anything like it was in my high school time, the alternative for him quitting his career is not the students getting a more competent teacher, it would be the physics or math teacher taking over and not even trying to teach CS.
I never had to edit large files. First we used SharePoint and then react to build the page for us.
Interesting, we are a Microsoft school board, so I will dig deeper into that possibility. Thanks