Bu, bir sonraki projenizi oluşturmak için ihtiyacınız olan eksiksiz bir web geliştirme kaynağıdır. 150’den fazla kaynak buraya dahil edilmiştir. Projelerinizde keşfetmekten ve kullanmaktan çekinmeyin.
Uygulama Proje Listesi
- Frontend – Frontend Development Roadmap.
- Backend – Backend Development Roadmap.
- React – React Development Roadmap.
- Andriod – Android Development Roadmap.
- DevOps – DevOps Roadmap.
- MDN Web Docs – The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps.
- DevDocs – Fast, offline, and free documentation browser for developers. Search 100+ docs in one web app.
- DEVHINTS – A modest collection of cheatsheets.
- FLEX – Malven – A visual cheatsheet for CSS flex layout.
- GRID – Malven – A visual cheatsheet for CSS grid layout.
- CSS Grid Cheat Sheet – Your ultimate CSS grid visual guide.
- OverAPI – Collection Of Cheat Sheets.
- Awesome Cheatsheets – Awesome cheatsheets for popular programming languages, frameworks and development tools.
- GitSheet – A dead simple git cheatsheet.
- HTML5 Doctor – This is a quick reference of elements that are new or have been redefined in HTML5.
- HTML5 Canvas Cheat Sheet – HTML5 Canvas Cheat Sheet.
- Cheatography – Programming Cheat Sheets.
- CSS 3, Media Queries Cheat Sheet – CSS 3, Media Queries Cheat Sheet.
- SEO Cheat Sheet – The Web Developer’s SEO Cheat Sheet.
- Bootstrap 5 Cheat Sheet – ThemeSelection’s Bootstrap 5 Cheat Sheet.
- Figma – Figma helps teams create, test, and ship better designs from start to finish.
- Adobe XD – Share your story with designs that look and feel like the real thing. Wireframe, animate, prototype, collaborate, and more — it’s all right here, all in one place.
- Sketch – Create, prototype, collaborate, and bring your ideas to life with the design platform used by over one million people — from freelancers, to the world’s largest teams.
- Whimsical – Communicate visually at the speed of thought – collaborative flowcharts, wireframes, sticky notes, and mind maps.
- Undesign – Collection of free design tools and resources for makers, developers and designers.
- How the Internet Works Video – How does the Internet Works?
- How the Internet Works Brief Videos – A brief explanations on, how does the Internet works?
- DNS – How DNS works?
- HTTPS – How HTTPS works?
- freeCodeCamp – Free course to learn Web Development.
- Interneting Is Hard – Friendly web development tutorials for complete beginners.
- Learn to Code HTML & CSS – The guide covers a variety of web design and development topics, ranging from beginner to advanced skill levels.
- HTML Elements – HTML elements reference by MDN.
- HTML Entity – HTML Entity Reference by CSS-Tricks.
- HTML Shark – Smart moves and dirty tricks for coding websites, effects and elements in HTML.
- CSS3 Properties – CSS reference by MDN.
- CSS Reference – A free visual guide to CSS.
- CSS Layout – A collection of popular layouts and patterns made with CSS.
- Modern CSS Solutions – A series examining modern CSS solutions to problems.
- CSS Diner – A fun game to help you learn and practice CSS selectors.
- Flexbox Froggy – A game that helps you to learn CSS Flex.
- CSS TRICKS – Flexbox – A Complete Guide to Flexbox.
- Grid by Example – Everything you need to learn CSS Grid Layout.
- Grid Garden – A game for learning CSS Grid.
- CSS TRICKS – A Complete Guide to Grid – A comprehensive guide to CSS grid, focusing on all the settings both for the grid parent container and the grid child elements.
- Learn CSS Grid – A comprehensive guide to help you understand and learn CSS Grid Layout, by Jonathan Suh.
- Can I Use – Up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
- CSS Effects – CSS Animations.
- Keyframes – Create basic or complex CSS @keyframe animations with a visual timeline editor.
- Animista – Play with a collection of ready to use CSS animations.
- BEM – BEM naming cheat sheet.
- Autoprefixer – Autoprefixer is a PostCSS plugin which parses your CSS and adds vendor prefixes.
- CSS Formatter – Online CSS Formatter, CSS Beautifier.
- Placeholder – How To Use Our Placeholders. Just specify the image size after our URL and you’ll get a placeholder image.
- DevProjects – Practice your coding skills with free HTML/CSS projects. Projects vary from beginner to advanced level.
- CodePen – Build, share, and learn JavaScript, CSS, and HTML with our online code editor
- Frontend Mentor – Improve your front-end skills by building real projects. Solve real-world HTML, CSS and JavaScript challenges whilst working to professional designs.
- Good Code – Browse through dozens of front end coding challenges, complete with Adobe XD files and styleguides.
- codier – Explore and attempt front-end coding challenges.
- CSSBattle – CSS code-golfing is here! Use your CSS skills to replicate targets with smallest possible code. Feel free to check out the targets below and put your CSS skills to test.
- Google Fonts – The #1 resource for free and easy-to-use webfonts.
- Fonts Arena – Free fonts, free alternatives to premium fonts, done-for-you-research articles.
- Fontjoy – Fontjoy helps designers choose the best font combinations. Mix and match different fonts for the perfect pairing.
- FontPair – Font Pair helps designers pair Google Fonts together. Beautiful Google Font combinations and pairs.
- Font Playground – Play with variable fonts.
- Font Anything – Type Anything is a free and awesome typography tool to create and test font combinations for your projects.
- Coolors – Generate or browse beautiful color combinations for your designs.
- 0to255 – A color tool that makes it easy to lighten and darken colors.
- ColorBox – Create amazing color sets superfast.
- color x color – A tool to create accessible color systems for UIs
- Colors and Fonts – Find colors and typography combinations ready to copy paste in one click.
- ColorSpace – Generate nice Color Palettes.
- CSS Gradient – Free css gradient generator tool.
- uiGradients – A handpicked collection of beautiful color gradients for designers and developers.
- Picular – The color of anything.
- Colorable – Choose font colors based on your background color.
- Happy Hues – Curated colors in context.
- Unsplash – Free images and photos.
- Pexels – Free stock photos.
- Pixabay – Free image or video.
- LOADING.IO – Free spinner for your projects.
- LottieFiles – LottieFiles is a collection of animations designed for Lottie – gone are the days of bugging your developer.
- removebg – Remove Image Background.
- Remove Photo Data – Remove personal data from photos before sharing them on the internet.
- befunky – BeFunky’s all-in-one online Creative Platform has everything you need to easily edit photos, create graphic designs, and make photo collages.
- unDraw – Browse to find the illustrations that fit your needs and click to download.
- manypixels – Free illustrations to power up your projects. Use them in a commercial or non-commercial way for your landing pages, blog posts, email newsletters, social media graphics and more.
- DrawKit – Hand-drawn vector illustration and icon resources, perfect for your next project.
- freepik – Free graphic resources.
- Ionicons – Open-Sourced and MIT licensed icon pack.
- Font Awesome – Vector icons and social logos.
- Material Icons – Material icons are delightful, beautifully crafted symbols for common actions and items. Download on desktop to use them in your digital products for Android, iOS, and web.
- Icones – Icons collection.
- icons8 – Download free icons in PNG and SVG.
- flaticon – Free vector icons in SVG, PSD, PNG, EPS format or as ICON FONT.
- Tabler Icons – Fully customizable free SVG icons.
- icofont – 2100+ free icons to spice up your creative designs.
- Simple Icons – 1463 Free SVG icons for popular brands.
- Get Emoji – ✂️ Copy and ? Paste Emoji ?.
- Ikonate – Customizable icons pack.
- useAnimations – Free animated icons.
- Lorem Ipsum – Lorem Ipsum generator.
- RealFaviconGenerator – Favicon generator
- Favicon Maker – Free Favicon maker.
- Meta Tags – Meta Tags generator, preview how your webpage will look on Google, Facebook, Twitter and more!
- Clippy – CSS clip-path maker.
- i Hate Regex – i Hate Regex is a regex cheat sheet that also explains the commonly used expressions so that you understand it.
- Regex101 – Online regex tester.
- Web Code Tools – Generate HTML5, CSS3, Microdata, JSON-LD, Twitter Cards, Open Graph and more!
- Carbon – Create and share beautiful images of your source .
- CSS Grid Generator – Quickly design web layouts, and get HTML and CSS code. Learn CSS Grid visually and build web layouts with our interactive CSS Grid Generator.
- CSS Scroll Shadows – Adjust the controls (?) and see the CSS scroll shadows change.
- CSS Shadow Generator – Make a smooth shadow.
- Haikei – Generate unique SVG design assets.
- transform – Transform | A polyglot web converter.
- Perflink | JS Benchmarks – JavaScript performance benchmarks you can share via URL.
- Accessibility Blog – Medium – Seven easy-to-implement guidelines to design a more accessible web.
- Accessibility Blog – Dev – 13 ways to level up your site’s accessibility.
- Accessibility Cheatsheet – Practical approaches to Universal Design for making your website/webapp accessible to everyone.
- web.dev – See how well your website performs. Then, get tips to improve your user experience.
- Lighthouse Metrics – Lighthouse Metrics provides easy insights for your site’s performance.
- freeCodeCamp – Best free resource to learn JavaScript interactively.
- Codecademy – Free course to learn JavaScript interactively.
- JavaScript.info – Modern JavaScript Tutorial.
- JavaScripture – JavaScripture.com is a testing ground and reference for all JavaScript APIs.
- Eloquent JavaScript – This is a book about JavaScript, programming, and the wonders of the digital. You can read it online here.
- JavaScript30 – 30 days vanilla JS coding challenge. Build 30 things in 30 days with 30 tutorials.
- How JavaScript works
- JavaScript Reference By MDN
- JavaScript Event Reference
- DOM Manipulation Reference
- JavaScript Design Patterns
- RegexOne – Learn Regular Expressions with simple, interactive exercises.
- Node.js Tutorial – Node.js Crash Course Tutorial by Net Ninja.
- Mixu’s Node book – A book about using Node.js.
- Node JS – Node.js original documentation.
- 30 Days of Node – 30 days of node, a node.js tutorial series.
- nodebestpractices – Huge list of best practices for building node apps. Important for big projects.
- The Node Way – An entire philosophy of Node.js best practices a0nd guiding principles exists for writing maintainable modules, scalable applications, and code that is actually pleasant to read.
- You Don’t Know Node.js
- Awesome Nodejs – Delightful Node.js packages and resources.
- Express.js Security Tips – How You Can Save and Secure Your App.
- Learn Python Programming – This site contains materials and exercises for the Python 3 programming language.
- PY4E – Python for Everybody.
- Dive Into Python 3 – Dive Into Python 3 covers Python 3 and its differences from Python 2. Compared to Dive Into Python, it’s about 20% revised and 80% new material. The book is now complete.
- Codecademy – Free course to learn Python interactively.
- Programiz – Learn Python Programming.
- Awesome Python – A curated list of awesome Python frameworks, libraries, software and resources.
- Flask Tutorial – The Flask Mega-Tutorial by Miguel Grinberg.
- React – Official site documentations, tutorial.
- Codecademy – Free React course of Codecademy.
- freeCodeCamp – Free web development resourse, where you can also learn react.
- React Tutorial – React Tutorial – Fundamentals, Hooks, Context API, React Router, Custom Hooks by Coding Addict.
- React Beach Resort – React Beach Resort project by Coding Addict.
- Awesome React – A collection of awesome things regarding React ecosystem.
- React Icons – Include popular icons in your React projects easily with react-icons.
- Public APIs – A collective list of more than 1000 Free Public and Open REST APIs for developers.
- JSONPlaceholder – Free to use fake Online REST API for testing and prototyping.
- OpenWeather – Simple and fast and free weather API from OpenWeatherMap you have access to current weather data, hourly, 5- and 16-day forecasts.
- SWAPI – The Star Wars API.
- Quotes REST API – They Said So has more than 1 million+ quotes in the database, the largest such database in the world. And Quotes API gives easy way to access the data.
- Postman – Postman makes API development easy. Simplify each step of building an API and streamline collaboration so you can create better APIs—faster.
- Insomnia – Leading Open Source API Client, and Collaborative API Design Platform for GraphQL, and REST.
- JSON Server – Get a full fake REST API with zero coding in less than 30 seconds (seriously). Created with <3 for front-end developers who need a quick back-end for prototyping and mocking.
- npm trends – Which NPM package should you use? Compare NPM package download stats over time. Spot trends, pick the winner.
- BUNDLEPHOBIA – Find the cost of adding a npm package to your bundle.
- freeCodeCamp – Learn to code at home. Build projects. Earn certifications.
- w3schools – The world’s largest Web Developer site. Tutorials references, examples, exercies, certificates.
- Codecademy – Learn the technical skills you need for the job you want. As leaders in online education and learning to code.
- Real Python – Learn Python online: Python tutorials for developers of all skill levels, Python books and courses, Python news, code examples, articles, and more.
- Study Tonight – Best place to learn Engineering subjects like Core Java, C++, DBMS, Data Structures etc through Hand-written simple Tutorial, Tests, Video tutorials.
- Programiz – Learn to code in Python, C/C++, Java, and other popular programming languages with our easy to follow tutorials, examples, online compiler and references.
- JavaScript Info – The Modern JavaScript Tutorial.
- Command Line Tutorial – Basic UNIX commands tutorial.
- Try Git – An interactive series of challenges to learn about and experiment with Git.
- ResumeGenius – The only online resume builder that’ll land you interviews. Create a professional resume in minutes, download, and print.
- resume.io – Free online resume maker, allows you to create a perfect resume in minutes. See how easy it is to write a professional resume and apply for jobs today!
- Resume Now – It Only Takes A Few Minutes. An online resume maker shouldn’t take long to use—and our free-to-use resume builder doesn’t.
- Canva – With Canva’s free resume builder, applying for your dream job is easy and fast. Choose from hundreds of free.
- novoresume – Make a perfect resume in 2020 and get your dream job using the free resume builder. Select a template. Personalize it.
- RX-Resume – Easily build your resume.
- mailsac – Disposable testing email inbox service.
- Ethereal Email – Ethereal is a fake SMTP service, mostly aimed at Nodemailer users (but not limited to).
- HTTP Status Codes – HTTP Status Code directory, with definitions, details and helpful code references.
- Play With Docker – A simple, interactive and fun playground to learn Docker.
- Tiny Helpers – A collection of free single-purpose online tools for web developers.
- Free for Developers – This is a list of software and other offerings that have free tiers for developers.
- Dev Resources – Dev Resources has everything for your developer journey, all presented in curated lists.
- Themeselection – Selected high quality, modern design, professional and easy-to-use Free Admin Dashboard Template, HTML Themes and UI Kits to create your applications faster.
- DEV – A constructive and inclusive social network. Open source and radically transparent.
- Medium – Medium is an open platform where readers find dynamic thinking, and where expert and undiscovered voices can share their writing on any topic.
- Hacker News – Get the latest from Hacker News!
- Hacker Noon – Hacker Noon reflects the technology industry with unfettered stories and opinions written by real tech professionals.
- freeCodeCamp News – Free Code Camp community news.
- Smashing Magazine – Smashing Magazine — for web designers and developers.
- Hashnode – Hashnode is a free content creation platform and community that allows you to publish articles on your own domain.