├── QuickResourcesForDevelopersBanner.png ├── contributing.md ├── LICENSE └── README.md /QuickResourcesForDevelopersBanner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jeannienguyen/quick-resources-for-developers/HEAD/QuickResourcesForDevelopersBanner.png -------------------------------------------------------------------------------- /contributing.md: -------------------------------------------------------------------------------- 1 | # Contributing Guidelines 2 | 3 | - Add single resource in one pull request as it will allow for quicker review. 4 | 5 | - Pull request title should include resource name and resource section. 6 | 7 | - Example: `[Randoma11y] -> [Design]` 8 | 9 | - Provide a link to the resource in the PR comment section. 10 | 11 | - Example: `Link: https://randoma11y.com/` 12 | 13 | - Double check that the resource is free. 14 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Jeannie Nguyen 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![Repository Banner](QuickResourcesForDevelopersBanner.png) 2 | 3 | #### Please read [`Contributing Guidelines`](./contributing.md) before submitting new resources. 4 | 5 | ## Table of Contents 6 | 7 | - [APIs](#apis) 8 | - [Chrome Extensions](#chrome-extensions) 9 | - [CLI](#cli) 10 | - [Design](#design) 11 | - [Editors and IDEs](#editors-and-ides) 12 | - [Frontend Cheatsheets](#frontend-cheatsheets) 13 | - [Interview Prep](#interview-prep) 14 | - [Optimization](#optimization) 15 | - [Sandboxes](#sandboxes) 16 | - [Templates](#templates) 17 | - [UI Inspiration](#ui-inspiration) 18 | 19 | ## APIs 20 | 21 | > APIs 22 | 23 | | Resources                            | Description | 24 | | ---------------------------------------------------------------------------------------------------------- | ------------------------------------------------- | 25 | | [AmiiboAPI](https://www.amiiboapi.com/) | A RESTful API for Amiibo | 26 | | [COVID 19 API](https://covid19api.com/) | A free API for data on the Coronavirus | 27 | | [FOAAS](https://www.foaas.com/) | Fuck Off As A Service | 28 | | [Pokémon TCG API](https://pokemontcg.io/) | Pokémon Trading Card Game API | 29 | | [REST Countries](https://restcountries.eu/) | Get information about countries via a RESTful API | 30 | | [Trefle](https://trefle.io/) | A global plants API | 31 | | [Financial Modeling Prep API](https://financialmodelingprep.com/developer/) | Stock, financial data and statements API | 32 | 33 |
34 | ↥ Back To Top 35 |
36 | 37 | ## Chrome Extensions 38 | 39 | > Chrome extensions helpful for developers 40 | 41 | | Resources                            | Description | 42 | | ---------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | 43 | | [Web Developer](https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm) | Adds web developer tools | 44 | | [CSS Viewer](https://chrome.google.com/webstore/detail/cssviewer/ggfgijbpiheegefliciemofobhmofgce) | Simple CSS property viewer | 45 | | [Wappalyzer](https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg) | Identify web technologies | 46 | | [JSONView](https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc) | Validate and view JSON documents | 47 | | [Lorem Ipsum Generator](https://chrome.google.com/webstore/detail/lorem-ipsum-generator-def/mcdcbjjoakogbcopinefncmkcamnfkd) | Create default text | 48 | | [The Great Suspender](https://chrome.google.com/webstore/detail/the-great-suspender/klbibkeccnjlkjkiokjodocebajanakg) | Suspends useless tabs | 49 | | [Talend API Tester](https://chrome.google.com/webstore/detail/talend-api-tester-free-ed/aejoelaoggembcahagimdiliamlcdmfm) | Visually interact with REST, SOAP and HTTP APIs. | 50 | | [Clear Cache](https://chrome.google.com/webstore/detail/clean-guru-cache-history/njjijbcogjkninkeeobbbkcbiblpjafa) | Clear caches | 51 | | [WhatFont](https://chrome.google.com/webstore/detail/whatfont/pfbmlnomgijlihdlfkainnbialppgilg) | Hover and see which font is used | 52 | | [PerfectPixel](https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi) | Create website with pixel perfect accuracy | 53 | 54 |
55 | ↥ Back To Top 56 |
57 | 58 | ## CLI 59 | 60 | > Useful CLI resources 61 | 62 | | Resources                            | Description | 63 | | ---------------------------------------------------------------------------------------------------------- | ----------------- | 64 | | [Github](https://training.github.com/downloads/github-git-cheat-sheet/) | Github Cheatsheet | 65 | 66 |
67 | ↥ Back To Top 68 |
69 | 70 | ## Design 71 | 72 | > Design resources 73 | 74 | | Resources                            | Description | 75 | | ---------------------------------------------------------------------------------------------------------- | -------------------------------------------------- | 76 | | [unDraw](https://undraw.co/) | Open-source illustrations and SVG images | 77 | | [FontPair](https://fontpair.co/) | Font pairs and other typography resources | 78 | | [Make Wave SVGs](https://getwaves.io/) | Wave SVG generator | 79 | | [Make Blob SVGs](https://www.blobmaker.app/) | Blob SVG generator | 80 | | [Buttons](https://unicorn-ui.com/buttons/builder/) | A CSS button library built with Sass & Compass | 81 | | [Animate.css](https://animate.style/) | CSS animations | 82 | | [CSShake](https://elrumordelaluz.github.io/csshake/) | CSS shake graphics | 83 | | [Hero Patterns](https://www.heropatterns.com/) | SVG background patterns for web projects | 84 | | [Subtle Patterns](https://www.toptal.com/designers/subtlepatterns/) | Free tilable textured patterns | 85 | | [CSS Specificty Calculator](https://specificity.keegan.st/) | A visual way to understand CSS specificity | 86 | | [Randoma11y](https://randoma11y.com/) | Random generated color pattern with high contrast | 87 | | [HTML Color Codes](https://www.hexcolortool.com/) | Colors in Hex, RGBA, and HSL | 88 | | [Color Hex](https://www.colorhexa.com/) | A color tool that provides info about any color | 89 | | [Color Safe](http://colorsafe.co/) | Accessible color palettes based on WCAG Guidelines | 90 | | [UI Gradients](https://uigradients.com/#Pizelex) | Colored gradients | 91 | | [Color Schemes Generator](https://coolors.co/) | Create or get inspired by color schemes | 92 | | [CSS Gradient](https://cssgradient.io/) | CSS generator, maker, and background | 93 | | [Copy & Paste Emojis](https://getemoji.com/) | Copy and paste emojis, no apps required | 94 | | [Emojipedia](https://emojipedia.org/) | Emoji library | 95 | | [Radix Icons](https://icons.modulz.app/) | 15×15 icons | 96 | 97 |
98 | ↥ Back To Top 99 |
100 | 101 | ## Editors and IDEs 102 | 103 | > Editor + IDE shortcuts for higher productivity 104 | 105 | | Resources                            | Description | 106 | | -------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | 107 | | [20 VS Code Shortcuts](https://medium.com/better-programming/20-vs-code-shortcuts-for-fast-coding-cheatsheet-10b0e72fd5d/) | VS Code shortcuts | 108 | | [VS Code Windows Keyboard Shortcuts](https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf) | VS Code shortcuts for Windows | 109 | | [IntelliJ IDEA Keyboard Shortcuts](jetbrains.com/help/idea/mastering-keyboard-shortcuts.html) | IntelliJ IDEA keyboard shortcuts | 110 | | [Top 15 IntelliJ IDEA Shortcuts](https://blog.jetbrains.com/idea/2020/03/top-15-intellij-idea-shortcuts/) | Top 15 IntelliJ IDEA shortcuts | 111 | 112 |
113 | ↥ Back To Top 114 |
115 | 116 | ## Frontend Cheatsheets and References 117 | 118 | > Cheatsheets and references 119 | 120 | | Resources                            | Description | 121 | | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------- | 122 | | [JavaScript ES2015](https://devhints.io/es6) | Cheatsheet for JavaScript ES2015 | 123 | | [JavaScript](http://overapi.com/javascript) | Cheatsheet for JavaScript | 124 | | [JavaScript Regular Expression](https://www.debuggex.com/cheatsheet/regex/javascript) | Cheatsheet for JavaScript RegEx | 125 | | [Emmet](https://docs.emmet.io/cheat-sheet/) | Cheatsheet for Emmet | 126 | | [React](https://devhints.io/react) | Cheatsheet for React | 127 | | [Redux](https://github.com/linkmesrl/react-journey-2016/blob/master/resources/egghead-redux-cheat-sheet-3-2-1.pdf) | Cheatsheet for Redux | 128 | | [Vue.js](https://vuejs-tips.github.io/cheatsheet/) | Cheatsheet for Vue.js | 129 | | [Vuex](https://vuejs-tips.github.io/vuex-cheatsheet/) | Cheatsheet for Vuex | 130 | | [Angular 4](https://angular.io/guide/cheatsheet) | Cheatsheet for Angular 4 | 131 | | [Flexbox](https://yoksel.github.io/flex-cheatsheet/) | Cheatsheet for Flexbox | 132 | | [SCSS](https://devhints.io/sass) | Cheatsheet for SCSS | 133 | | [Stylus](https://devhints.io/stylus) | Cheatsheet for Stylus | 134 | | [GraphQL](https://bit.ly/2PYcYPk) | Cheatsheet for GraphQL | 135 | | [Webpack](https://devhints.io/webpack) | Cheatsheet for Webpack | 136 | | [CSS Specificity](https://css-tricks.com/specifics-on-css-specificity/) | CSS specificty cheatsheet | 137 | | [HTML Reference](https://htmlreference.io/) | A Guide to All Elements and Attributes | 138 | | [CSS Reference](https://cssreference.io/) | A Visual Guide to CSS | 139 | | [Codrops CSS Reference](https://tympanus.net/codrops/css_reference/) | An Extensive CSS Reference | 140 | 141 |
142 | ↥ Back To Top 143 |
144 | 145 | ## Interview Prep 146 | 147 | > Resources to help you with your upcoming interviews 148 | 149 | | Resources                            | Description | 150 | | ------------------------------------------------------------------------------------------------------------------ | ----------------------------- | 151 | | [Back-End Developer Interview Questions](https://github.com/arialdomartini/Back-End-Developer-Interview-Questions) | Back-end interview questions | 152 | | [Front-End Developer Interview Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions) | Front-end interview questions | 153 | 154 |
155 | ↥ Back To Top 156 |
157 | 158 | ## Optimization 159 | 160 | > Optimization 161 | 162 | | Resources                            | Description | 163 | | ---------------------------------------------------------------------------------------------------------- | --------------------------------------------------- | 164 | | [Pingdom Website Speed Test](https://tools.pingdom.com/) | Test & analyze the load time of a live page | 165 | | [WebPagetest](https://www.webpagetest.org/) | Speed test from multiple locations around the globe | 166 | | [PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights/) | Analyze website speed performance | 167 | | [TinyPNG](https://tinypng.com/) | Image compression | 168 | 169 |
170 | ↥ Back To Top 171 |
172 | 173 | ## Sandboxes 174 | 175 | > Sandboxes and playgrounds 176 | 177 | | Resources                            | Description | 178 | | ---------------------------------------------------------------------------------------------------------- | ------------------------------------------- | 179 | | [Codepen](https://codepen.io/) | Online editor - build & test front-end code | 180 | | [Devtools Playground](https://mozilladevelopers.github.io/playground/) | Firefox Devtools Playground | 181 | 182 |
183 | ↥ Back To Top 184 |
185 | 186 | ## Templates 187 | 188 | > Free HTML templates for developers 189 | 190 | | Resources                            | Description | 191 | | ---------------------------------------------------------------------------------------------------------- | -------------------------------- | 192 | | [UI deck](http://uideck.com) | Landing page templates | 193 | | [Creative Tim](http://creative-Tim.com) | UI kits, tools ,resources etc. | 194 | | [HTML 5 UP](http://html5up.net) | Spiffy HTML5 site templates | 195 | | [Free Html 5](http://freehtml5.co) | HTML5 bootstrap templates | 196 | | [One Page Website](http://onepagelove.com) | One page websites templates | 197 | | [Grey Grids](http://graygrids.com) | Dashboard and business templates | 198 | | [Landing Page Template](http://inovatik.com) | Free landing page templates | 199 | | [UI Cookies](http://uicookies.com) | Responsive web templates | 200 | | [W3Layouts](https://w3layouts.com/) | Free HTML 3000+ templates | 201 | 202 |
203 | ↥ Back To Top 204 |
205 | 206 | ## UI Inspiration 207 | 208 | > List of inspirational UI 209 | 210 | | Resources                            | Description | 211 | | ---------------------------------------------------------------------------------------------------------- | --------------------------------- | 212 | | [Dribble](https://dribbble.com) | UI creation platform | 213 | | [Evernote](https://www.evernote.design) | All in the one bookmarks | 214 | | [Page Flows](https://pageflows.com) | Better user flow from products | 215 | | [UI Designs](https://uimovement.com/) | UI inspirational designs for devs | 216 | | [UI Garage](https://uigarage.net/) | Hand picked UI | 217 | | [Collectt UI](http://collectui.com/) | Daily updated UI | 218 | 219 |
220 | ↥ Back To Top 221 |
222 | --------------------------------------------------------------------------------