diff --git a/code-quality/01-editorconfig/index.html b/code-quality/01-editorconfig/index.html index 26c9be3..b5244f2 100644 --- a/code-quality/01-editorconfig/index.html +++ b/code-quality/01-editorconfig/index.html @@ -78,4 +78,4 @@ 
root = true

 
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

VS Code plugin

-

Although some editors have support for editorconfig build in, for VS Code, you need to install the EditorConfig for VS Code plugin.

\ No newline at end of file +

Although some editors have support for editorconfig build in, for VS Code, you need to install the EditorConfig for VS Code plugin.

\ No newline at end of file diff --git a/code-quality/02-eslint/index.html b/code-quality/02-eslint/index.html index a3959e6..d00909e 100644 --- a/code-quality/02-eslint/index.html +++ b/code-quality/02-eslint/index.html @@ -85,4 +85,4 @@

Run ESLint

Terminal window
npx eslint ./js/**/*.js

If you want to fix some issues immediately, you can append the --fix flag to the comment.

VS Code plugin

-

By using the VS Code ESLint plugin, you can see the errors and warnings directly in your editor. You can configure this in a way every file you save is automatically linted.

\ No newline at end of file +

By using the VS Code ESLint plugin, you can see the errors and warnings directly in your editor. You can configure this in a way every file you save is automatically linted.

\ No newline at end of file diff --git a/code-quality/03-stylelint/index.html b/code-quality/03-stylelint/index.html index 8ad1033..90d8d50 100644 --- a/code-quality/03-stylelint/index.html +++ b/code-quality/03-stylelint/index.html @@ -80,4 +80,4 @@

Run stylelint

You can run Stylelint on all your css files by running the following command:

Terminal window
npx stylelint "**/*.css"

VS Code plugin

-

By using the VS Code Stylelint plugin, you can see the errors and warnings directly in your editor. See the documentation how to configure this in a way it doesn’t collide with the build in VS Code CSS linting.

\ No newline at end of file +

By using the VS Code Stylelint plugin, you can see the errors and warnings directly in your editor. See the documentation how to configure this in a way it doesn’t collide with the build in VS Code CSS linting.

\ No newline at end of file diff --git a/deployment/combell/01-domain/index.html b/deployment/combell/01-domain/index.html index 608b2f3..0223f64 100644 --- a/deployment/combell/01-domain/index.html +++ b/deployment/combell/01-domain/index.html @@ -117,4 +117,4 @@

Check your mails

  • This contains a link to your hosting dashboard.
    • - \ No newline at end of file + \ No newline at end of file diff --git a/deployment/combell/02-settings/index.html b/deployment/combell/02-settings/index.html index a57ef94..b5dde9c 100644 --- a/deployment/combell/02-settings/index.html +++ b/deployment/combell/02-settings/index.html @@ -86,4 +86,4 @@

    Activate SSH

    Click Add, to add a new SSH key. Download devine2022.pub. You can open this file with VS Code and copy/paste the content. Click Add SSH key, to complete.

    NOTE: we only access your hosting to check the date of the final upload. We do not upload or modify any content on your hosting. Select the SSH option from the menu. Activate SSH access by moving the switch. It can take a while until SSH is activated.

    Combell SSH

    -

    Combell Add SSH key

    \ No newline at end of file +

    Combell Add SSH key

    \ No newline at end of file diff --git a/deployment/ftp/01-ftp-client/index.html b/deployment/ftp/01-ftp-client/index.html index c7bc61b..50c3fa8 100644 --- a/deployment/ftp/01-ftp-client/index.html +++ b/deployment/ftp/01-ftp-client/index.html @@ -97,4 +97,4 @@

    Configure

    FileZilla Insecure

    You should see an overview of the folder structure of the server on the right side of your screen. Your local folder structure is on the left side. Check your settings again if you see an error message. Mostly it is because you made a typo in the name of the host, username or password.

    -

    FileZilla Files

    \ No newline at end of file +

    FileZilla Files

    \ No newline at end of file diff --git a/deployment/ftp/02-uploading/index.html b/deployment/ftp/02-uploading/index.html index 61decb8..d16f2f2 100644 --- a/deployment/ftp/02-uploading/index.html +++ b/deployment/ftp/02-uploading/index.html @@ -80,4 +80,4 @@

    Folder structure

    You have only access to one hosting package with one domain name. Because you want to upload multiple projects over time, you need to put them in their own folder.

    To create a new folder, right-click on the www folder and select create directory. Enter a name of the folder and click ok.

    Uploading files and folders

    -

    You can upload files and folders by dragging them from Finder to the correct folder in FilleZilla. You can also drag files from the left pane in FileZilla. Both methods work in the same way.

    \ No newline at end of file +

    You can upload files and folders by dragging them from Finder to the correct folder in FilleZilla. You can also drag files from the left pane in FileZilla. Both methods work in the same way.

    \ No newline at end of file diff --git a/git/basics/git-01-intro/index.html b/git/basics/git-01-intro/index.html index 2ae5eec..ed55fde 100644 --- a/git/basics/git-01-intro/index.html +++ b/git/basics/git-01-intro/index.html @@ -105,4 +105,4 @@

    Git from the command line

    We will use git from the command line. There are some applications that allow you to execute git commands via a GUI, but if you want to perform more advanced actions you will have to go back to the command line anyway.

    Git is installed when you install the xcode command line tools. (or run xcode-select --install) So if you have already done this (for example to make Node.js work), you can get started right away. Another option (without the command line tools) is to download and install git from http://git-scm.com/downloads.

    Resources

    -

    https://gitexplorer.com/

    \ No newline at end of file +

    https://gitexplorer.com/

    \ No newline at end of file diff --git a/git/basics/git-02-create-repo/index.html b/git/basics/git-02-create-repo/index.html index bc6d5ce..840bbf4 100644 --- a/git/basics/git-02-create-repo/index.html +++ b/git/basics/git-02-create-repo/index.html @@ -78,4 +78,4 @@

    Via the git status command you can get some more information about the current status of the repository. You often use this command to see which files have been changed, whether there are new files, or whether files have been deleted.

    Terminal window
    $ git status
    # On branch main
    #
    # No commits yet
    # nothing to commit (create/copy files and use "git add" to track)

    Heads up

    -

    Be aware where exactly you initialize the new repository. You wouldn’t be the first to accidentally put its whole documents directory under source control. If you are not entirely sure where you are, run the command pwd to print the current working directory.

    \ No newline at end of file +

    Be aware where exactly you initialize the new repository. You wouldn’t be the first to accidentally put its whole documents directory under source control. If you are not entirely sure where you are, run the command pwd to print the current working directory.

    \ No newline at end of file diff --git a/git/basics/git-03-commit/index.html b/git/basics/git-03-commit/index.html index dcc360c..3ce7588 100644 --- a/git/basics/git-03-commit/index.html +++ b/git/basics/git-03-commit/index.html @@ -102,4 +102,4 @@

    git add -A .

    We’ve seen before that with git add . you can stage all changes before commit. Keep in mind that deletes (deleting files) are not staged. To do that, you need to add the -A flag to the command.

    GUI

    It is important to know how to work with git via the command line. Without understanding the basic commands, it is impossible to understand more complex commands that you will need sooner or later.

    -

    That said, for some very common commands, it can become cumbersome to execute them all the time. Luckily for us, some GIT functionality is baked in VS Code already. See this paragraph about commits for more information.

    \ No newline at end of file +

    That said, for some very common commands, it can become cumbersome to execute them all the time. Luckily for us, some GIT functionality is baked in VS Code already. See this paragraph about commits for more information.

    \ No newline at end of file diff --git a/git/basics/git-04-undo/index.html b/git/basics/git-04-undo/index.html index 390cdb8..89a84ea 100644 --- a/git/basics/git-04-undo/index.html +++ b/git/basics/git-04-undo/index.html @@ -121,4 +121,4 @@

    Undo commits

    first commit

    You will only use such a git reset command to undo local commits. Once you’re collaborating with others, and commits have already been distributed to other users, you use the git revert command to create a new commit that undoes a previous commit.

    Resources

    -

    https://ohshitgit.com/

    \ No newline at end of file +

    https://ohshitgit.com/

    \ No newline at end of file diff --git a/git/basics/git-05-ignore/index.html b/git/basics/git-05-ignore/index.html index ed3c96c..f73bd49 100644 --- a/git/basics/git-05-ignore/index.html +++ b/git/basics/git-05-ignore/index.html @@ -102,4 +102,4 @@

    .gitignore

    Add and commit this file to include it in your repository.

    Terminal window
    git add .
    git commit -m "added .gitignore"

    In practice, you will create such a .gitignore file as one of your first files. This way you avoid “contaminating” your repository with unnecessary files, and you avoid drastic actions such as deleting folders & files from the history. -A list of useful .gitignore files can be found here: https://github.com/github/gitignore

    \ No newline at end of file +A list of useful .gitignore files can be found here: https://github.com/github/gitignore

    \ No newline at end of file diff --git a/git/basics/git-06-branches/index.html b/git/basics/git-06-branches/index.html index 2f83882..a916d98 100644 --- a/git/basics/git-06-branches/index.html +++ b/git/basics/git-06-branches/index.html @@ -100,4 +100,4 @@

    Master/main

    A ‘main’ branch doesn’t have any superpowers or other special features, in the end, it is just a name.

    You can easily rename a branch with the following command:

    Terminal window
    git branch -m OLD-BRANCH-NAME NEW-BRANCH-NAME
    -

    If you like to gain some more background information on this, you can read this article

    \ No newline at end of file +

    If you like to gain some more background information on this, you can read this article

    \ No newline at end of file diff --git a/git/basics/git-07-tipsandtricks/index.html b/git/basics/git-07-tipsandtricks/index.html index d8cdfa8..6a9134e 100644 --- a/git/basics/git-07-tipsandtricks/index.html +++ b/git/basics/git-07-tipsandtricks/index.html @@ -75,4 +75,4 @@

    Git’s behavior regarding file and folder names is influenced by the case sensitivity of the underlying file system. Some file systems, like macOS by default, are case-insensitive, while others like those in most Linux distributions are case-sensitive. To be sure git picks up filename changes, —especially when you are only changing the casing of a filename— one should use the git mv command.

    Terminal window
    git mv MyFileName myfilename

    Don’t create repositories inside iCloud/OneDrive or other cloud-synced folders

    -

    Since the .git directory contains a lot of files and folders, syncing takes forever and can cause issues. It’s best to create repositories in a local folder.

    \ No newline at end of file +

    Since the .git directory contains a lot of files and folders, syncing takes forever and can cause issues. It’s best to create repositories in a local folder.

    \ No newline at end of file diff --git a/git/collaboration/collab-01-github-push/index.html b/git/collaboration/collab-01-github-push/index.html index faa6140..c46feaf 100644 --- a/git/collaboration/collab-01-github-push/index.html +++ b/git/collaboration/collab-01-github-push/index.html @@ -123,4 +123,4 @@

    Git add - commit - push

    Terminal window
    On branch main
    Your branch is ahead of 'origin/main' by 2 commits.
    (use "git push" to publish your local commits)
    nothing to commit (working directory clean)

    Execute git push to put your commits on GitHub:

    Terminal window
    Enumerating objects: 6, done.
    Counting objects: 100% (6/6), done.
    Delta compression using up to 12 threads
    Compressing objects: 100% (4/4), done.
    Writing objects: 100% (5/5), 488 bytes | 488.00 KiB/s, done.
    Total 5 (delta 2), reused 0 (delta 0)
    remote: Resolving deltas: 100% (2/2), completed with 1 local object.
    To git@github.com:demouser/hellogit.git
        f1e8b69..a8515e0  main -> main
    -

    When you view the repository through your browser, you will see that the contents of the README.md file are shown below the list of files. This is a file in the Markdown format. (the same for the file you are reading now…) Markdown is a simple markup language for formatting documents. More information about this can be found on Wikipedia or this GitHub specific flavor

    \ No newline at end of file +

    When you view the repository through your browser, you will see that the contents of the README.md file are shown below the list of files. This is a file in the Markdown format. (the same for the file you are reading now…) Markdown is a simple markup language for formatting documents. More information about this can be found on Wikipedia or this GitHub specific flavor

    \ No newline at end of file diff --git a/git/collaboration/collab-02-pull-rebase/index.html b/git/collaboration/collab-02-pull-rebase/index.html index 02e5bd4..f7cd01d 100644 --- a/git/collaboration/collab-02-pull-rebase/index.html +++ b/git/collaboration/collab-02-pull-rebase/index.html @@ -108,4 +108,4 @@

    rebase

    project_2 $ git pull --rebase
    remote: Enumerating objects: 3, done.
    remote: Counting objects: 100% (3/3), done.
    remote: Compressing objects: 100% (1/1), done.
    remote: Total 2 (delta 1), reused 2 (delta 1), pack-reused 0
    Unpacking objects: 100% (2/2), done.
    From git@github.com:demouser/hellogit
    c18628a..de80b79 main -> origin/main
    First, rewinding head to replay your work on top of it...
    Applying: removed project2.txt

    This way, no merge commit is created. When you execute git status you see that you are now only 1 commit ahead of the remote repository, instead of 2:

    Terminal window
    project_2 $ git status
    On branch main
    Your branch is ahead of 'origin/main' by 1 commit.
      (use "git push" to publish your local commits)
    nothing to commit (working directory clean)
    -

    Push to the remote repository. Also pull in the projects folder so that both repositories are up-to-date.

    \ No newline at end of file +

    Push to the remote repository. Also pull in the projects folder so that both repositories are up-to-date.

    \ No newline at end of file diff --git a/git/collaboration/collab-03-merge-conflicts/index.html b/git/collaboration/collab-03-merge-conflicts/index.html index dafad87..b77b025 100644 --- a/git/collaboration/collab-03-merge-conflicts/index.html +++ b/git/collaboration/collab-03-merge-conflicts/index.html @@ -98,4 +98,4 @@
    Terminal window
    project_2 $ git push
    Counting objects: 5, done.
    Delta compression using up to 8 threads.
    Compressing objects: 100% (2/2), done.
    Writing objects: 100% (3/3), 326 bytes, done.
    Total 3 (delta 0), reused 0 (delta 0)
    To git@github.com:demouser/hellogit
        7f3b200..920c81f  main -> main

    Execute git pull in the other folder so that both are synced again.

    Visually resolve conflicts

    -

    If you like a more visual way, you can resolve merge conflicts in VS Code

    \ No newline at end of file +

    If you like a more visual way, you can resolve merge conflicts in VS Code

    \ No newline at end of file diff --git a/homebrew-01-intro/index.html b/homebrew-01-intro/index.html index 7760f5b..69fca8f 100644 --- a/homebrew-01-intro/index.html +++ b/homebrew-01-intro/index.html @@ -90,4 +90,4 @@

    Update packages

    You can run brew update to update the registry of packages. This will not update the packages themselves. Therefore, you have to run brew upgrade.

    Uninstall a package

    To uninstall a package, you can run brew uninstall <package-name>.

    -

    Happy brewing!

    \ No newline at end of file +

    Happy brewing!

    \ No newline at end of file diff --git a/index.html b/index.html index c716928..14af698 100644 --- a/index.html +++ b/index.html @@ -80,4 +80,4 @@
  • Modules/npm
  • Vite
  • Homebrew
    • - \ No newline at end of file + \ No newline at end of file diff --git a/modules/packages-01-modules/index.html b/modules/packages-01-modules/index.html index dd9b5c3..2cf90b5 100644 --- a/modules/packages-01-modules/index.html +++ b/modules/packages-01-modules/index.html @@ -77,4 +77,4 @@

    Modules

    Originally, JavaScript didn’t have any mechanism to split and combine pieces of code. NodeJS came with support for this with require(), later, things like RequireJS, Webpack and Babel made this possible for JavaScript on the browser. It was waiting until ES6 for a native module syntax in the browser. Luckily for us, the same syntax is available now in Nodejs. Have a look at this article for some examples

    -

    Further reference on MDN

    \ No newline at end of file +

    Further reference on MDN

    \ No newline at end of file diff --git a/modules/packages-02-npm/index.html b/modules/packages-02-npm/index.html index a0e1d3c..e8bffb9 100644 --- a/modules/packages-02-npm/index.html +++ b/modules/packages-02-npm/index.html @@ -103,4 +103,4 @@

    nvm

    Have a look at the documentation to see which other options are possible.

    [^1] Assuming that the xcode command line tools are installed (run xcode-select –install otherwise)

    npm

    -

    There is no need to install npm on its own, it comes with the installation of Node.js. Try it, just run npm on the command line.

    \ No newline at end of file +

    There is no need to install npm on its own, it comes with the installation of Node.js. Try it, just run npm on the command line.

    \ No newline at end of file diff --git a/modules/packages-03-practice/index.html b/modules/packages-03-practice/index.html index e73f819..4999289 100644 --- a/modules/packages-03-practice/index.html +++ b/modules/packages-03-practice/index.html @@ -137,4 +137,4 @@

    npm install

    > hellonpm@1.0.0 start
    > node .
    Hello Node.js The id is: 7paYoH6CZva14wUhX9mgf

    And there you have it: we’ve installed and used a npm package. The first of many to come :-)

    -

    If it is not entirely clear why we occupy us with all this stuff, see the next chapter where we take a look at some advantages.

    \ No newline at end of file +

    If it is not entirely clear why we occupy us with all this stuff, see the next chapter where we take a look at some advantages.

    \ No newline at end of file diff --git a/modules/packages-04-advantages/index.html b/modules/packages-04-advantages/index.html index e1ffdfc..e051ff3 100644 --- a/modules/packages-04-advantages/index.html +++ b/modules/packages-04-advantages/index.html @@ -135,4 +135,4 @@

    Version Control

  • package.json: do include in version control
  • package-lock.json: do include in version control
    • -

    The package-lock.json file is auto generated en keeps track of all the packages installed in your project. For instance: it is perfectly possible that two separate packages both need the same dependency. Npm then decides which version to install en keeps track of this in the lock file. So this can speed tings up in successive installations.

    \ No newline at end of file +

    The package-lock.json file is auto generated en keeps track of all the packages installed in your project. For instance: it is perfectly possible that two separate packages both need the same dependency. Npm then decides which version to install en keeps track of this in the lock file. So this can speed tings up in successive installations.

    \ No newline at end of file diff --git a/modules/packages-05-npx/index.html b/modules/packages-05-npx/index.html index b510d8d..d5af057 100644 --- a/modules/packages-05-npx/index.html +++ b/modules/packages-05-npx/index.html @@ -94,4 +94,4 @@

    A more useful example

    Terminal window
    $ npx gitignore
    Need to install the following packages:
      gitignore
    Ok to proceed? (y)
    Usage: gitignore [PROJECT TYPE]
    Example: gitignore rails
    Available project types can be found by running `gitignore -types` or at https://github.com/github/gitignore

    We need to add a type run npx gitignore -types, visit the url or just follow our advice and run npx gitignore node for a typical node/web project.

    Terminal window
    $ npx gitignore node
    Created .gitignore file for flag type node.
    -

    And there you have it, a .gitignore file in your project.

    \ No newline at end of file +

    And there you have it, a .gitignore file in your project.

    \ No newline at end of file diff --git a/terminal-01/index.html b/terminal-01/index.html index cdccbf4..e12279f 100644 --- a/terminal-01/index.html +++ b/terminal-01/index.html @@ -140,4 +140,4 @@

    Resources

  • We hope this resource helps designers and non-technical folks appreciate and love the command line like we do!
  • Terminal, npm, git and some little tricks
  • You don’t need GUI
    • - \ No newline at end of file + \ No newline at end of file diff --git a/vite-01-intro/index.html b/vite-01-intro/index.html index 19c2f4d..05afd32 100644 --- a/vite-01-intro/index.html +++ b/vite-01-intro/index.html @@ -144,4 +144,4 @@

    Preview

    Deployment on a subdirectory

    It is quite common for us to deploy something on a “nested public path” (aka subdirectory). By default, Vite assumes we are deploying on the root of a domain, so we can run into some issues when requiring assets.

    To let Vite know the name of te subdirectory (structure), we can add a base property to the build argument in our package.json. See the documentation for more details.

    -
    {
     "scripts": {
      "build": "vite build --base=/my/public/path/"
     }
    }
    \ No newline at end of file +
    {
     "scripts": {
      "build": "vite build --base=/my/public/path/"
     }
    }
    \ No newline at end of file