Dev Resources
Improve Your Coding
- 100 days of css - https://100dayscss.com
- flexbox frogger - https://flexboxfroggy.com
- css battle - https://cssbattle.dev
- css challenge - https://css-challenges.com
- Flex box defense - http://www.flexboxdefense.com
- css diner - https://flukeout.github.io
- Grid garden - https://cssgridgarden.com
- flexbox Zombies - https://mastery.games/flexboxzombies/
- CSS Animations - https://css-animations.io
Helpful Online Tools
- Tiny wow (Conversion tools) - https://tinywow.com
- Grammarly (chrome extension & Web) - https://www.grammarly.com
- codersrank.io - https://codersrank.io
- Quillbot (A good way to rephrase your words) - https://quillbot.com
- PX & REM calculator - https://pixtorem.vercel.app
Coding Software & Tools
- RunJs -https://runjs.app Able to run your code. A great IDE especially testing a small amount of code.
- Responsively App, helps you view webpages on different devices - https://responsively.app
- Shottr - https://shottr.cc
- Polypane (browser for devlopers) - https://polypane.app
Imrprove your Design
- Daily UI - https://www.dailyui.co
- UI Design Daily - https://www.uidesigndaily.com
- Collective UI Challenge - https://collectui.com/challenges
- UI verse - https://uiverse.io
- BEM (Methodology, CSS Architecture) - http://getbem.com/
Inspirational Designs
- Collect UI - https://collectui.com
- Web deign inspiration - https://www.webdesign-inspiration.com
- call to idea - https://www.calltoidea.com
- Savee it - https://savee.it
- Awwwards - https://www.awwwards.com
- Dribble - https://dribbble.com
- Godly Websites - https://godly.website/
- CSS Design awards - https://www.cssdesignawards.com
- CSS Zen Garden - http://www.csszengarden.com
- CSS Winner - https://www.csswinner.com
- Same Energy (Photo Search) - https://same.energy
- Degreeless Design - https://www.degreeless.design
- Learn Mobile Design - https://learnmobile.design
- Human Interface Guidelines - https://developer.apple.com/design/human-interface-guidelines
- sass landing page - https://saaslandingpage.com
- site inspire - https://www.siteinspire.com
- btw landing page examples - https://www.btw.so/marketing/landing-page-examples
UX/UI References
- Qualtrics UX Design Glossary - https://www.qualtrics.com/blog/ux-design-glossary/
- Laws of UX - https://lawsofux.com
- UI Patterns - https://ui-patterns.com/
- Design Principles - https://principles.design
- UI Library - https://www.uxlibrary.org
- Web Content Accessibility Guidelines - https://www.w3.org/TR/WCAG21/
- Material Design Guidelines - https://m2.material.io/design
- Material Design Accessibility guidelines - https://m2.material.io/design/usability/accessibility.html#understanding-accessibility
- U.S. Web Design System (USWDS) - https://designsystem.digital.gov/
Graphic & Photos
- Happy Hues - https://www.happyhues.co
- Characterz Design - https://characterz.design
- Font Awesome - https://fontawesome.com
- Reshot - https://www.reshot.com
- Pixabay - https://pixabay.com
- Photopea - https://www.photopea.com (photoshop alternative)
- StockSnap - https://stocksnap.io
- ISO Republic - https://isorepublic.com
- Skitterphoto - https://skitterphoto.com
- icon8 - https://icons8.com
- logo to use - https://www.logotouse.com
- UI Design Resources - https://uihut.com
- Bootstrap Icons - https://icons.getbootstrap.com (instructions are at the bottom of their webpage)
- Picography - https://picography.co
- Vertex - https://vertex.im
- unsplash photos - https://unsplash.com
- Open Peeps - https://www.openpeeps.com
- Pexels - https://www.pexels.com
Audio
- No Copyright Sounds - https://ncs.io | https://www.youtube.com/user/nocopyrightsounds
NOTE TAKING:
- Evernote (universal): https://evernote.com/
- Snippets Lab (mac): https://www.renfei.org/snippets-lab
- Notion (online): https://www.notion.so/product
- Quiver (mac): https://www.notion.so/product
- CherryTree (Win/Mac/Linux): https://www.giuspen.com/cherrytree
README EDITOR/Guides:
- Markdown guide: https://www.markdownguide.org/cheat-sheet/
- Typora (Win/Mac/Linux): https://typora.io
- StackEdit (Online): https://stackedit.io
VSCODE EXTENSIONS:
- VS Code Pets(somethign that is just cute): - https://marketplace.visualstudio.com/items?itemName=tonybaloney.vscode-pets
- LiveServer: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
- Better Commands: https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments
- Git Graph: https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph
- Project Manager: https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager
- Draw.io: https://marketplace.visualstudio.com/items?itemName=hediet.vscode-drawio
- Excalidraw VS Code Extension: https://marketplace.visualstudio.com/items?itemName=pomdtr.excalidraw-editor
- Auto Close Tag: https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag
- PostgresSQL: https://marketplace.visualstudio.com/items?itemName=ms-ossdata.vscode-pgsql
- TODO Tree: https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree
- WSL - Microsfot (for PC)https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-wsl
Planning Apps / Diagram/ Wireframes
- Excalidraw - https://excalidraw.com - Drawing app to help with diagrams
- Diagrams - https://app.diagrams.net/ entity relationship diagram software
- Figma - https://www.figma.com
- Adobe XD - https://www.adobe.com/products/xd.html
- Fluid UI - https://www.fluidui.com
- Penpot - https://penpot.app
- Diagram.io https://dbdiagram.io/home
- DrawDB https://www.drawdb.app/
- DB Designer - https://www.dbdesigner.net
- Diagrams.net - https://app.diagrams.net
- LucidChart - https://www.lucidchart.com/pages/examples/database-design-tool
- Drawsql - https://drawsql.app
- Github Projects - https://docs.github.com/en/issues/organizing-your-work-with-project-boards Check your repo and go to the project tab
- Jira (Project management tool/Kanban) - https://www.atlassian.com/software/jira A wonderful kanban board and project management tools that can be attached to GitHub and bitbucket.
- Asana (Project Management tool) - https://asana.com/ A lighter version of Jira
