Learn Git, Leaflet and Screen-reader

In this course, Colby is going to do a deep dive into creating a full store for your products. You'll learn how to set up and use GraphCMS as your content management system. You'll learn about the Cloudinary UI extension and how to use it to host your images. You'll learn about Snipcart and using the useSnipcart hook to handle the cart state and the checkout. You'll learn how to implement Stripe as your payment gateway. And lastly, you'll learn how to deploy a Next js app to vercel from github with environment variables.

snipcart

Ecommerce Product Management & Storefront with GraphCMS, Snipcart, & Next.js

A large number of people are unable to use the web effectively due to an impairment or disability.

As developers there are several tools and techniques we can use to make our web applications accessible, ensuring a great user experience that includes everyone.

We all agree that Accessibility is important. However, it’s a broad landscape and can be overwhelming figuring out where to start!

Erin Doyle is an expert in creating accessible React applications and has developed a course that will give you a concrete process for testing, refactoring, and building your applications with accessibility in mind.

After this course, you'll have a jump start on auditing and fixing accessibility issues in your applications and gain a better understanding of your target users and how to approach your web app design from their perspectives.


React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

Develop Accessible Web Apps with React

If you've ever worked on a website for a business, there's a good chance you've included a map.

A Google Map embed is sufficient for showing a location, but doesn't leave you many customization options.

React Leaflet to the rescue!

In this course, Colby Fayock will guide you through a series of lessons and challenges that will build your map making skills as you build out a web app for a fictional restaurant.

You'll get practice with handling API keys and using React Hooks to implement a custom interactive map complete with metadata and additional overlays.

This course has built-in challenges that you are encouraged to pause and work through, but feel free to just watch.

Build Maps with React Leaflet

This workshop will start by breaking down the four states in which a file can exist, and we'll build up our mental model of git from there. Then, we'll look at how to move files between those states in different ways.

Once we've developed a new model for how git operates, we'll be able to purposefully get ourselves into some sticky situations, and then gracefully recover from them.

If you can handle git add/commit/push, but not much more - then this workshop is perfect for you.

You can finally get some proper git training, and will never have to worry about losing data or messing up the repo again!

Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.

Fix Common Git Mistakes

In this collection, you'll learn the basics of creating a new map in your React application with React Leaflet. We'll walk through adding the map itself as well as adding markers with popups, different shapes, and increasingly complex features to your map!

Mapping with React Leaflet

Knowing your everyday toolset increases your productivity as a developer. And Git is one of those tools you use on a daily basis. Mastering Git is tough; it has hundreds of different commands, often even inconsistent at how you pass in flags and configuration options. On the other side, there are a lot of good Git courses out there already, explaining all of these commands in detail. 

With this course, I aim at a different goal. You will walk through a series of scenarios which you’ll most commonly encounter in your daily work life as a developer. I’m talking:
 - updating your feature branch with the latest changes from master
 - polishing your git history to make it ready for being peer-reviewed
 - moving a set of commits to another branch
 - undoing accidental commits

The goal is not to cover everything, but those tasks that will greatly improve your daily productivity with Git.


Productive Git for Developers

As modern web developers, we are likely to use git on a daily basis. It's a wonderful distributed version control system, and with only a few commands in our toolbelt it is quite powerful and convenient.

In this course, you will learn the basics of using git, as well as some more advanced commands that you should find useful!

Check out these [**community notes for this course on Github**](https://github.com/eggheadio-projects/practical-git-for-everyday-professional-use-notes).

Practical Git for Everyday Professional Use

“Feel free to submit a PR!” - words often found in GitHub issues, but met with confusion and fear by many. Getting started with contributing open source is not always straightforward and can be tricky. With this series, you’ll be equipped with the the tools, knowledge, and understanding you need to be productive and contribute to the wonderful world of open source projects. Much of this series speaks about GitHub, but most of the concepts are generally applicable to contributing to any open source project, regardless of where it’s hosted.

So enjoy the course and start contributing to the projects you use and love today!

How to Contribute to an Open Source Project on GitHub

Most projects have automatically generated files or folders from the operating system, applications, package managers etc. Usually, we don't want to include these types of things in our remote repos because they can clutter the git history/storage and are not applicable to everyone that works on the project. In this lesson, we show how to create a `.gitignore` file to ignore files and folders from being tracked by git.

Practical Git: Remove unnecessary git tracking with .gitignore files

When working with Git, the most common thing developers do is stage, commit, and push the changes they make to a code base - this "edit -> stage -> commit -> push" cycle is the main workflow when using Git; it lets developers make "snapshots" of changes to their codebase which they can share and revert back to. In this lesson, we make some changes to our codebase and then `git add` (stage), `git commit` (store in history), and `git push` (sync with our remote repository) those changes. We also use `git status` along the way to see an update of where our repository is at.

Practical Git: Capture code history snapshots with git add/commit/push

`git pull` lets us get the latest changes from our project's remote repo (most likely from co-workers or other developers working on our project) and merge (combine) them with our local code. It's kind of like Dropbox for code, but you tell git when you want it to get the latest changes from the remote when it is most convenient for you. In this lesson, we use `git pull` and discuss how it is a shortcut for running `git fetch` and `git merge`.

Practical Git: Sync local and remote repos with git pull

screen-reader

There are many techniques for hiding content in user interfaces, and not all are created equal! Learn how different hiding techniques in HTML, CSS and ARIA impact keyboard and screen reader users in addition to visual display. As a bonus, we'll also take a look using a screen reader on a mobile device.

How Visible vs. Hidden Elements Affect Keyboard/Screen Reader Users

When working on a project, it is much easier to work on features and bugs in isolation of the rest of the project. We can do this with git branches; a branch is a copy of the working directory, staging area, and project history; we create a branch, then check it out, then add commits. After our feature has been built, we can then merge it back into the main stable branch - which is `master` by default. In this lesson we go over how to create a branch with `git branch {branch-name}`, viewing all branches with `git branch`, switching branches with `git checkout` plus a few helper commands.

Practical Git: Isolate feature development with git branch

Getting started with Git requires you to add a .git folder to your project on your machine and then set up that folder to point to a remote repository. In this lesson, we walk through using `git init` and `git remote` to do this; we use GitHub for this remote repository as an example, but keep in mind that any Git repo hosting service will work.

Practical Git: Create local repos with git init

When working on code, we need a way to stay in sync across multiple devices and potentially multilpe team members. We also may need to work on our code offline. To do these things, we can "clone" a remote repo (from a git repo hosting service like GitHub or Bitbucket); git cloning means we make a copy of an existing remote repository onto our local machine with the `git clone` command. This command also automatically sets up the remote repo and branch tracking. Once our repo is cloned to our machine, we can work on the code in this directory offline or with teammates at the same time and then when we need to sync up we can push our code back to the central “remote" repo; we can also clone this same repo onto multiple machines and “pull” updates from the central “remote" repo whenever we want. In this lesson, we walk through how to do this.

Practical Git: Copy remote repos to local machines with git clone

Sometimes when you run `git merge` (also during a `git pull` which runs a `git merge`) you get a merge "conflict"; this means that the same line(s) of code were changed locally as in new changes in the remote (most likely from another developer working on a related feature); `git merge` can automatically merge all other changes but when the same line is modified in two places, you have to fix the conflict manually. In this lesson, we show how a conflict happening from a `git pull`, and then how to fix it using `git status` to update the conflict markers in our file(s) with conflicts. You can use a graphical app for this, but this lesson will show you how to resolve conflicts directly from the command line and your code editor.

Practical Git: Resolve merge conflicts with git status

Once a feature has been created inside of a branch, we can combine it back into the main `master` branch by using `git merge`. In this lesson, we go through a complete workflow of creating a feature branch and merging it back into the `master` branch.

Practical Git: Sync branches with git merge

Sometimes when we are working we need a way to pause and switch gears to deal with something more critical; often when this happens we aren't ready to create a `git commit`; instead, we can use `git stash` to save our uncommitted changes locally, switch branches and fix the critical issue, switch back to our incomplete feature, and finally run `git stash apply` to get our unfinished changes back into our branch without affecting the rest of the codebase. In this lesson, we show a real world example of doing this with a critical bug.

Practical Git: Save uncommitted changes with git stash

In this lesson we’ll talk about what GitHub is and how to sign up for a GitHub account so you can contribute to an open source project on GitHub.

Introduction to GitHub

GitHub adds a lot of great features on top of git repository hosting. We’ll take a look at some of these features including:

- How to create a repository and organization on GitHub
- How to explore and find projects on GitHub
- About GitHub gists
- Searching pull requests and issues on GitHub

Exploring GitHub

The basic unit of GitHub is a repository. This is where your code is stored and GitHub allows you to interact with others and with the code in great ways. In this lesson we talk about Watching, Starting, and Forking a repository. We also cover GitHub issues and pull requests and various other stats about a GitHub repository.

Search

Search Results