j10wy / ucb-classwork

Files created during class

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Resources

Blogs, Publications and Email Newsletters

A List Apart ⭐️ - A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices.

Code Burst - Bursts of code to power through your day. Web Development articles, tutorials, and news.

Code Pen's Spark ⭐️ - Weekly email/blog posts with the most intenteresting stuff on CodePen.

David Walsh Blog ⭐️ - A blog featuring tutorials about JavaScript, HTML5, AJAX, PHP, CSS, WordPress, and everything else development. (Twitter)

Increment - Quartly "magazine" that focuses experience of being a developer within technology companies and startups, best practices that companies have created and adopted to help developers work more effectively, and the tools and processes that developers use to get their jobs done.

Javascript Weekly ⭐️ - Interesting articles/opinions, news, tutorials, tools and code examples.

Mozilla Hacks - Mozilla Hacks is written for web developers, designers and everyone who builds for the Web. Hacks is produced by Mozilla's Developer Relations team and features hundreds of posts from Mozilla.

NPM Weekly - NPM news, featured packages and events.

Books

Access Safari eBooks for free with SF Library account

Secrets of the JavaScript Ninja ⭐️ - Authored by John Resig, the creator of the jQuery library. The book teaches you how to master key JavaScript concepts such as functions, closures, objects, prototypes, and promises.

You Don't Know JS ⭐️ Free on Github | Amazon

Chrome /FireFox DevTools

Colorful console.log

FireFox Developer Edition ⭐️

Pause Your Code With Breakpoints

Workbox - Workbox is a collection of libraries and build tools that make it easy to store your website’s files locally, on your users’ devices.

Command Line

asciinema - Record and share your terminal sessions

Command Line Power User - A video series for web developers on learning a modern command line workflow with ZSH, Z and related tools.

Explain Shell - write down a command-line to see the help text that matches each argument

oh-my-zsh ⭐️ - Oh-My-Zsh is an open source, community-driven framework for managing your ZSH configuration. It comes bundled with a ton of helpful functions, helpers, plugins, themes

Spaceship ZSH ⭐️ - Spaceship is a minimalistic, powerful and extremely customizable Zsh prompt. It combines everything you may need for convenient work, without unnecessary complications, like a real spaceship.

zsh-autosuggestions ⭐️ - Auto-suggestions for zsh

Computer Science

Algorithms & Big O Notation in Plain English - the only big o guide written in plain english.

Base CS - Exploring the basics of computer science, every Monday, for a year.

Visual Algo - visualising data structures and algorithms through animation.

MIT: Introduction to Computer Science and Programming in Python

CSS Documentation, Tools and Tutorials

Can I Use? ⭐️ - Browser support tables for HTML5, CSS3, JS, etc.

coolors - A color schemes generator. Create, save and share color palettes in seconds.

CSS Tricks ⭐️ - Tips, Tricks, and Techniques on using Cascading Style Sheets.

Sequence.js - responsive CSS animation framework for creating sliders, presentations, banners, and other step-based applications

Mozilla Developer's Playground ⭐️ - Learn, build, improve, and create with Firefox DevTools.

CSS Protips - A collection of tips to help take your CSS skills pro.

cssreference.io - Explains the most popular CSS properties with illustrated and animated examples.

CSS Variables: Why Should You Care? - Useful for reducing repetition in CSS, and also for powerful runtime effects like theme switching.

Codrops ⭐️ - In-depth how-tos involving common web development and web design techniques.

Flexbox Froggy - A game for learning CSS flexbox

Flexible Math - A quick way to get pixel widths in percentages.

Grabient - UI to generate linear-gradients

Lottie ⭐️ - mobile library for Web, and iOS that parses Adobe After Effects animations exported as json

MDN - Using CSS animations: Adding the animation event listeners - Use JavaScript code to listen for animation events

Nth-Test - Test nth-child and nth-of-type psuedo selectors

Editor Plugins (VS Code unless otherwise noted)

ASCIIDecorator

Excel Viewer - View Excel spreadsheets and CSV files within Visual Studio Code workspaces.

Git History - View git log, file history, compare branches or commits.

Snippet Generator (Sublime, Atom, VS Code) ⭐️ - Create custom snippets for your code editor.

Git History Diff ⭐️ - View git history. View commit details. View diff of committed files. Multi-root workspaces supported.

Git Lens ⭐️ - Seamlessly navigate and explore the history of a file or branch, gain valuable insights via powerful comparison commands, and so much more.

Git Project Manager ⭐️️ - Allows you to change easily between git projects.

highlight-matching-tag ⭐️️ - Highlights matching closing or opening tag.

NPM Intellisense ⭐️️ - Visual Studio Code plugin that autocompletes npm modules in import statements.

Rainbow Brackets ⭐️️ - Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets. This is particularly useful for Lisp or Clojure programmers, and of course, JavaScript, and other programmers.

Settings Sync ⭐️ - Sync your VS Code settings to Github. This allows you to sync your settings to VS Code on any PC/Mac you use.

Sublime Text Keymap ⭐️️ - Popular Sublime Text keybindings for VS Code.

TODO Highlight ⭐️️ ️- highlight TODOs, FIXMEs, and any keywords, annotations. Works great with todo bot

Git/Github

asciiflow - Create ASCII diagrams by drawing on the web. Not really Git/Github related, but great for readmes and documentation.

Carbon - Create and share images of your source code.

GitBook - Documentation made easy. GitBook helps your team write, collaborate and publish content online.

GitHub Marketplace - Tools to build on and improve your workflow

Shields.io ⭐️️ - Cool/informational badges for your Github readmes.

Todo bot ⭐️ - GitHub App that automagically creates new issues based on comments and keywords in your code when you push it to GitHub.

Tower 2 Win/Mac ⭐️ - Version control with Git - made easy. In a beautiful, efficient, and powerful app.

Hosting: services, security, deployment docs and tools

Cron-Job.org - Scheduled execution of your websites and scripts. Just in time or in flexible intervals, from minute-by-minute to once in a year. Absolutely free.

Glitch - Friendly community with instant hosting and deployment - anybody can build a web app on Glitch, for free.

Digital Ocean's tutorials and docs ⭐️ - These articles provide a detailed overview and reference for DigitalOcean features and products.

Let’s Encrypt - Let’s Encrypt is a free, automated, and open Certificate Authority.

Lets Encrypt Tutorial: How to Deploy a Node.js App to DigitalOcean with SSL ⭐️ - Learn how to use Digital Ocean and Let’s Encrypt to deploy an SSL-enabled Node.js app for $5/month — in 30 minutes.

Internet of Things

Adafruit - Adafruit Industries is an open-source hardware company based in New York City.

CircuitPython - a Python implementation for teaching coding with microcontrollers.

Node Bots - Learn how to make robots powered by JavaScript

Puck.js - A bluetooth beacon - an Open Source JavaScript microcontroller you can program and debug wirelessly.

Tessel 2 - Tessel 2 is a robust IoT and robotics development platform. Leverage all the libraries of Node.JS to create useful devices in minutes with Tessel.

JavaScript / Node

Anime.js - lightweight JavaScript animation library. It works with any CSS Properties, individual CSS transforms, SVG or any DOM attributes, and JavaScript Objects.

NPM docs and tutorials - These are the docs you're looking for :)

Scotch.io - "fun and practical" web development tutorials

Microsoft AI School (Node.js and Python) - Learn how to start building intelligence into your solutions with the Microsoft AI platform.

Next.js - React on the server side!

Together.js - Add real time collaboration features to your website!

Meetups

Github's Electron User Group

Google Confrences and Events

ReactJS SF Meetup

Node School ⭐️ San Francisco | Oakland

Serverless

SFNode

SF HTML5 ⭐️ ($10 fee but always super interesting and great for networking) - Meetup | YouTube (free and uploaded imediaty following the meetup)

People to Follow on Social Networks

Addy Osmani (Google) ⭐️ Twitter | Facebook

Kyle Simpson (author of You Don't Know JS book series) ⭐️ Github | Twitter

Podcasts

CTRL+CLICK - Features diverse voices from the industry’s leaders and innovators, who tackle everything from design, code and content management systems, to culture and business challenges. Focused, topical discussions teach, inspire and waste no time getting to the heart of the matter.

Hanselminutes ⭐️ - One of the best podcasts ever. Scott covers technology, culture, gadgets, diversity, code, community, social equity, media, entrepreneurship and above all, the open web.

IRL - Stories of life online and real talk about the future of the Web. IRL is an original podcast from Mozilla.

JavaScript Jabber - A a weekly discussion about JavaScript, front-end development, community, careers, and frameworks.

Shop Talk Show ⭐️ - An internet radio show about the internet starring Dave Rupert and Chris Coyier (of CSS Tricks and Codepen.io) And they have a job board!

Python

Awesome Python - A curated list of awesome Python frameworks, libraries, software and resources

CircuitPython - a Python implementation for teaching coding with microcontrollers.

Training and Certification (and other things to add to your LinkedIn profile)

Code Wars - Improve your skills by training with others on real code challenges.

Google Developer Training ⭐️ - Learn how to build production-ready web apps for mobile and desktop.

Google Developer Certification - Earn a certification from Google to gain recognition for your skills as a web developer.

MIT: Introduction to Computer Science and Programming in Python

Salesforce Trailhead ⭐️ - Many tutorials to build Salesfroce apps using Javascript on Heroku. You can add badges to LinkedIn upon completion of each module.

UI/UX

ai2html - An open-source script for Adobe Illustrator that converts your Illustrator documents into html and css.

Figma - Think Google docs for design, prototyping, and gathering feedback.

Windows

Git Bash

Install the Windows Subsystem for Linux

Ninite - The easiest, fastest way to update or install software. Ninite downloads and installs programs automatically in the background.

Command Prompt/PowerShell alternatives: cmder | Cygwin | Hyper

SSH on Windows PuTTy | Native on Win10

Synergy - Combine your computers into one cohesive experience

Virtual Box - VirtualBox is a general-purpose full virtualizer for x86 hardware, targeted at server, desktop and embedded use.

YouTube Channels and Users

Coding Tech - Coding Tech posts content which was originally published with the Creative Commons Attribution license on such channels as Confreaks, Web Rebels, dotconferences, and Engineers.SG.

Computerphile - Videos all about computers and computer stuff.

Derek Banas - Creates tutorials based on subscriber requests. Uploads new programming videos on Saturday and Wednesday mornings.

DevTips - Weekly videos on the subject of web design and development.Travis is employed by Google, but that has nothing to do with this channel. He and this channel do not represent Google. At all. Not even a little.

DigitalOcean - The D.O. channel's goal is to create a frictionless experience that enables developers to deploy faster and scale more easily.

Firebase ⭐️ - The Youtube channel for all things Firebase! Learn how to build awesome apps with hands-on tutorials from the Firebase team.

ForwardJS - Talks recorded at the Forward.js Web Technology Summit

Fun Fun Function ⭐️ - A fun, personal and down-to-earth show about programming. Also on Medium

Tower: Git GUI

Misc. random / cool stuff that I am too lazy to categorize

AR.js - Augmented Reality for the Web.

jsnes - A JavaScript NES emulator.

Paper Programs - browser-based system for running Javascript programs on pieces of paper.

snipplr - Keep all of your frequently used code snippets in one place that's accessible from any computer. You can share your code with other visitors and use what they post, too.

Slack Themes - A Slack sidebar theme browser.

WOFF font converter - This handy tool converts TTF or OTF fonts to WOFF format.

About

Files created during class


Languages

Language:HTML 47.4%Language:JavaScript 44.7%Language:Python 4.6%Language:CSS 3.2%