Ihatesignup
New Member
Hi community,
everyone starts small, but even the experienced web developer makes his life easier by using resources that are freely accessible on the Internet.
Here are some of them...
CSS helper
Bear CSS is a handy little tool for web designers. It generates a CSS template with all the HTML elements, classes and IDs defined in your markup.
A collection of different CSS generators for e.g. gradients, border radius etc. So it is more for beginners who are not yet able to program or style fluently with CSS.
For me the very best site to learn everything from A-Z about CSS3 and to find examples. It is ideal for beginners, but also for professionals to refresh their knowledge.
Another collection of CSS3 helpers and code generators that is very extensive and is more for beginners.
Ready scripts
One of my personal favorite sites when it comes to good ideas and finished snippets. There you will find high-quality code snippets and templates for free.
Here you have a large selection of ready-made scripts, templates and experiments that you can use for your own projects.
Codepen is not only a playground for creating code snippets, but you can also find lots of code snippets for your own project there.
Code beautifier and optimizer
I don't need to say anything more about the code beautification tools, because they do exactly that, they improve and beautify your code.
Resources for icons and images
There you can search and find icons for your project and many of them are free to use.
Another good source for icons.
An icon and favicon generator
One of the best sources to get free stock images and vector graphics.
Tutorials and things to know
There you will find detailed instructions on common web development and web design techniques.
A super comprehensive tutorial to convert Photoshop PSD files into HTML templates. You can find tons of other good tutorials on this site.
Uncle Google's knowledge and example database. Here the webmaster will find everything worth knowing about web design but unfortunately also a lot of blahhh blahh. Just Google, so extensive that it hurts
Development environment, editor
Koding provides developers and team managers with an interface to streamline development workflows in the cloud without sacrificing freedom and creativity.
GitHub is not only ideal for hosting and administering projects, but also offers extensive projects, templates or tutorials that you can enrich yourself with
A bootstrap editor to create new templates. Everything is drag & drop and super easy to handle.
Have fun with your next project.
everyone starts small, but even the experienced web developer makes his life easier by using resources that are freely accessible on the Internet.
Here are some of them...
CSS helper
Bear CSS - Helping you build a solid stylesheet foundation based on your markup
Bear CSS - Helping you build a solid stylesheet foundation based on your markup
bearcss.com
The ultimate CSS tools for web designers | CSSmatic
www.cssmatic.com
Toptal's CSS3 Generator Tool allows you to easily generate useful snippets of CSS3 and copy them straight into your projects.
Toptal's CSS3 Generator Tool allows you to easily generate useful snippets of CSS3 and copy them straight into your projects.
www.css3maker.com
Ready scripts
CodyHouse | Web Design Nuggets
CodyHouse is an arsenal of production-ready components and tools that empower web designers to craft digital experiences faster and better.
codyhouse.co
Playground | Codrops
The Playground features web experiments, concepts, and layouts that push the boundaries of traditional design and showcase the latest in animation techniques.
tympanus.net
Codepen is not only a playground for creating code snippets, but you can also find lots of code snippets for your own project there.
Code beautifier and optimizer
I don't need to say anything more about the code beautification tools, because they do exactly that, they improve and beautify your code.
Online Code Beautifier for JavaScript, JSON, HTML, CSS and PHP
With Code Beautifier, you can pretty-print and syntax highlight source code written in JavaScript, JSON, Python, HTML, CSS, PHP and other programming languages.
ctrlq.org
Online JavaScript beautifier
beautifier.io
Resources for icons and images
8,425,000+ free and premium vector icons, illustrations and 3D illustrations
Iconfinder is the world's largest marketplace for icons, illustrations and 3D illustrations in SVG, AI, and PNG format.
www.iconfinder.com
Icon Archive - 800,000+ free icons & stickers, PNG, SVG Downloads
Discover 800,000+ free icons. Browse icons by category, artist, popularity, date. PNG, SVG, ICO files. Share your favorites via Twitter or WhatsApp.
www.iconarchive.com
Free Online Icon Generator | Convert Image to *.ICO File
Creat FavIcon.ico (favorites icon) from your favorites logo, image, pic and photo files
www.prodraw.net
Freepik | Create great designs, faster
Millions of free graphic resources. ✓ Photos ✓ AI images ✓ Vectors ✓ Icons ✓ Templates ✓ Videos. Find out about our real-time AI art generator. #freepik
www.freepik.com
Tutorials and things to know
Tutorials | Codrops
In this section, you will find a variety of in-depth articles written by skilled front-end developers that cover a range of web development and web design techniques.
tympanus.net
The Most Detailed PSD to HTML Tutorial
With our Photoshop PSD to Responsive HTML Web Design video course, you will learn how to design and code a website from scratch. PSD to HTML doesn't get easier than this!
1stwebdesigner.com
Web Development Products & Tools - Google for Developers
Create fast, secure sites and apps for the open web. Check out our web app development tools to build modern websites using the latest technologies.
developers.google.com
Development environment, editor
Modern Dev Environment Delivered · Koding | Modern Dev Environment Delivered · Koding
Instantly create, share, scale, and manage development environments.
www.koding.com
GitHub: Let’s build from here
GitHub is where over 100 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and fea...
github.com
LayoutIt! - Interface Builder for CSS Grid and Bootstrap
LayoutIt! is a interface builder for CSS Grid and Bootstrap that wants to be the kick-off for your front-end developments.
www.layoutit.com
Have fun with your next project.