diff --git a/book/installation-and-setup/user_types.md b/book/installation-and-setup/user_types.md index 9f99f01..df278be 100644 --- a/book/installation-and-setup/user_types.md +++ b/book/installation-and-setup/user_types.md @@ -17,8 +17,9 @@ Different types of users will interact with the website or the Jupyter Books dif 5. **Colleague making text and code (especially Python) adjustments to multiple files at the same time locally**.
Example Image
This user has more knowledge in GitLab/GitHub than the previous user and can basically take care of branching and merging by themselves. They know how to work with software for editing .md and .ipynb files. They can use the draft book online to view their changed in the book, or build the book locally. +
```{Note} -At this point, you might already be trying to see which user type fits you the best. We are aware that the lines between user types can be a bit blurry, especially between type 3, 4 and 5. If case you're (1) a user type 3 and want to dabble in git or (2) a user type 4/5 and want to make some quick edits with only a few clicks, then you might consider using a more advanced online editor in GitHub (GitHub Dev) as explained [further on in Collaborative book-editing - Edit - User type 3 - GitHub](../workflows/edit_book.md). +At this point, you might already be trying to see which user type fits you the best. We are aware that the lines between user types can be a bit blurry, especially between type 3, 4 and 5. In case you're (1) a user type 3 and want to dabble in git or (2) a user type 4/5 and want to make some quick edits with only a few clicks, then you might consider using a more advanced online editor in GitHub (GitHub Dev) as explained further on in [Collaborative book-editing > Edit](../workflows/edit_book.md) > User type 3 > GitHub > Using VS Code in your browser. ``` \ No newline at end of file diff --git a/book/workflows/edit_book.md b/book/workflows/edit_book.md index 904c1ea..eda2308 100644 --- a/book/workflows/edit_book.md +++ b/book/workflows/edit_book.md @@ -4,7 +4,7 @@ Suppose we are writing a new chapter, or are updating an existing chapter for ou **Edit files as ...** `````````{tab-set} -````````{tab-item} ... user type 3 ... +````````{tab-item} ... user type 3 ... **... by directly adding changes on a single file to the Git-timeline (committing) in ...** @@ -47,9 +47,12 @@ In GitLab, you can directly make changes in the files on the remote repository. You can edit it and commit the changes in the same manner as with markdown (.md) files. `````` -``````{tab-item} ... GitHub +``````{tab-item} ... GitHub -How to make an edit and make a commit is demonstrated in the figure below, all steps are elaborated on in the following step-by-step tutorial. +`````{tab-set} +````{tab-item} ... using 'Edit in place' + +How to make an edit and make a commit is demonstrated in the gif below. Don't worry if the steps are too fast, all steps are elaborated on in the following step-by-step tutorial. ```{figure} figures/user3-collaboration.gif --- @@ -74,9 +77,6 @@ In GitHub, you can directly make changes in the files on the remote repository. Example Image -`````{tab-set} -````{tab-item} ... using 'Edit in place' - 4. In case you want to make changes to an existing file, navigate to the file in your remote repository. Then click the downward pointing arrow on the very left in the top bar. Select the option `Edit in place`.
@@ -100,11 +100,23 @@ You can edit it and commit the changes in the same manner as with markdown (.md) ```` ````{tab-item} ... using 'VS Code in your browser' -Using this feature, you can open VS Code in your browser and edit the files in your repository. By doing this, you completely by-pass the need to open (and install) VS Code and GitHub Desktop on your laptop making it the optimal way to quickly fix something. +Using this feature, you can open VS Code in your browser and edit the files in your repository. By doing this, you completely by-pass the need to open (and install) VS Code and GitHub Desktop on your laptop making it the optimal way to quickly fix something. You can make changes to the files already in the repository but you can also upload new files! -1. Navigate to your main page (`code`) of your repository in GitHub -2. Press the dot key on your keyboard `.` This will open VS Code -3. Navigate to a file and make some changes +1. Navigate to the repository you want to work in and make sure you're in the correct branch +2. Navigate to your main page (`code`) of your repository in GitHub +3. Press the dot key on your keyboard `.` This will open VS Code + +4. In case you want to add a new file, navigate to the explorer file (the page icon) and click on the `New File` icon. This will create a new file in the folder that you are in. give it the right extension! + +```{figure} ./figures/Online_VS0.PNG +:name: New File +:width: 60% +:align: center + +New File +``` + +5. In case you want to make changes to an existing file, navigate to a file and make some changes ```{figure} ./figures/Online_VS1.PNG :name: VS Code in Browser @@ -115,8 +127,8 @@ VS Code in Browser ``` In the bottom left you can see the branch you are working in. -4. This feature requires you to use git in VS Code. You can do that in the Source Control tab in the activity bar on the left side of the window (it looks like a branching icon). Write your commit message and click on commit & push. -5. Now let's see the result. Go back to your GitHub repo. In the top bar, go to actions. +6. Once all the changes are made it's time to commit and push. GitHub Dev requires you to use git in VS Code. You can do that in the Source Control tab in the activity bar on the left side of the window (it looks like a branching icon). Write your commit message and click on commit & push. +7. Now let's see the result. Go back to your GitHub repo. In the top bar, go to actions. ```{figure} ./figures/Online_VS2.PNG :name: GitHub Actions @@ -138,7 +150,6 @@ Click on the link and admire your changes:) ```` ````` - `````` ``````` ```````` @@ -656,4 +667,4 @@ Alternatively, you can also click on `Push origin` in the top bar. `````` ``````` ```````` -````````` \ No newline at end of file +````````` diff --git a/book/workflows/figures/Online_VS0.PNG b/book/workflows/figures/Online_VS0.PNG new file mode 100644 index 0000000..6c3fc61 Binary files /dev/null and b/book/workflows/figures/Online_VS0.PNG differ