Bookmarks tagged with #webdev.
Show all
Show all
How to Report Errors in Forms: 10 Design Guidelines
Forms are necessary components of many applications and websites. We use them to log in, purchase items, send feedback, and enter our personal information.
Saved
on: 2019-02-08
React as a UI Runtime — Overreacted
Most tutorials introduce React as a UI library. This makes sense because React is a UI library. That’s literally what the tagline says! I’ve written about the challenges of creating user interfaces before. But this post talks about React in a different way — more as a programming runtime.
Saved
on: 2019-02-04
HTML, CSS and our vanishing industry entry points
Everyone is angry about CSS again. I’m not even going to try to summarize the arguments. However it always seems to boil down to the fact that CSS is simultaneously too easy to bother with, yet so hard it needs to be wrapped up in a ball of JavaScript in case it scares the horses.
Saved
on: 2019-02-01
Why isn't the internet more fun and weird?
By mistake, MySpace inspired a generation of teenagers to learn how to code. From Stealing MySpace: But Nguyen forgot to block Web markup language in user submissions.
Saved
on: 2019-01-31
nginxconfig.io
Sites: Presets: Domain Path Document root www subdomain enabled ({{ isWWW() ? 'www.' : '' }}{{ getDomain() }}) CDN subdomain enabled (cdn.
Saved
on: 2019-01-31
Front-End Performance Checklist 2019 [PDF, Apple Pages, MS Word] — Smashing
178 min read Performance, Debugging, CSS, JavaScript, PDF, Checklists, Guides, Core Web Vitals Saved for offline reading Share on Twitter, LinkedIn Let’s make 2021… fast! An annual front-end performance checklist (available as PDF, Apple Pages, MS Word), with everything you need to know to crea
Saved
on: 2019-01-10
mkcert: valid HTTPS certificates for localhost
The web is moving to HTTPS, preventing network attackers from observing or injecting page contents.
Saved
on: 2019-01-07
CORS, In A Way I Can Understand - DEV Community ????
Two days ago, I tweeted my frustration: I was an hour in to diagnosing a tiny browser error that was breaking the entire project: "CORS error, Access-Control nice try, you can't do that, ha ha" (I'm paraphrasing). Apparently, it resonated with a bunch of friends online.
Tags:
#webdev
Saved
on: 2019-01-02
The Elements of UI Engineering
In my previous post, I talked about admitting our knowledge gaps. You might conclude that I suggest settling for mediocrity. I don’t! This is a broad field. I strongly believe that you can “begin anywhere” and don’t need to learn technologies in any particular order.
Saved
on: 2018-12-31
Immutable Web Apps
The owner of immutablewebapps.org is offering it for sale for an asking price of 490 USD! This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers.
Saved
on: 2018-12-05
https://www.sarasoueidan.com/slides/SVG-Filters-Crash-Course.pdf
Saved
on: 2018-11-28
Mastering HTTP Caching | fortrabbit blog
Using CDNs has long been something in the domain of the Alexa top 100; something a small(er) website does not need or cannot afford. This has changed over the last years, with a multitude of pay-per-use, non-enterprise vendors on the market CDNs became affordable for everybody.
Saved
on: 2018-11-28
The Power of Web Components – Mozilla Hacks : the Web developer blog
Ever since the first animated DHTML cursor trails and “Site of the Week” badges graced the web, re-usable code has been a temptation for web developers. And ever since those heady days, integrating third-party UI into your site has been, well, a semi-brittle headache.
Saved
on: 2018-11-16
The Web Accessibility Introduction I Wish I Had
Hello again, past self. I'm sending you another message from a future where it's finally getting colder, you got the guts to go to therapy, and that thing under the floorboards somehow escaped. Most importantly, your future job responsibilities focus much more focus on web accessibility.
Saved
on: 2018-10-31
Web Performance 101
This is an introduction to modern web loading performance. Learn why performance is important, what performance optimizations exist, and which tools can help you understand if your app is performing well.
Saved
on: 2018-10-30
nystudio107 | An Annotated webpack 4 Config for Frontend Web…
Please consider 🎗 sponsoring me 🎗 to keep writing articles like this. Building a modern website has become custom application development.
Saved
on: 2018-10-25
Perceived Performance: The Only Kind That Really Matters
Saved
on: 2018-10-03
The Complete Guide to Lazy Loading Images | CSS-Tricks
Images are critical for every website and application today. Whether it be marketing banners, product images or logos, it is impossible to imagine a website without images. Sadly though, images are large in size making them the single largest contributor to the page size.
Tags:
#webdev
Saved
on: 2018-09-27
Who left open the cookie jar? A comprehensive evaluation of third-party cookie policies
Who left open the cookie jar? A comprehensive evaluation of third-party cookie policies from the Franken et al., USENIX Security 2018 This paper won a ‘Distinguished paper’ award at USENIX Security 2018, as well as the 2018 Internet Defense Prize.
Tags:
#webdev
Saved
on: 2018-09-06
On structuring PHP projects — Nikola Poša - Blog
An indispensable part of every programming project is how you structure it, which involves organizing files and sources into directories, naming conventions, and similar. As your application grows, so does the need for structuring it in way that it is easy to manage and maintain.
Saved
on: 2018-08-28
Web Performance Made Easy: Google I/O 2018 edition
We've been pretty busy over the past year trying to figure out how to make the Web faster and more performant. This led to new tools, approaches and libraries that we’d like share with you in this article.
Saved
on: 2018-08-22
The easiest way to keep your web apps accessible: Just use text
The web is no longer just a collection of static text documents with a few images and GIFs thrown into the mix.
Saved
on: 2018-08-15
Building the Google Photos Web UI
A few years ago I had the privilege of being an engineer on the Google Photos team and part of the initial launch in 2015.
Saved
on: 2018-07-18
How Image Optimisation Decreased my Website's Page Weight by 62%
Images are one of the most fundamental types of content that is served on the web. They say an image is worth a thousand words, but it can also be worth quite a few megabytes too if you’re not careful.
Saved
on: 2018-07-16
CSS Grid in IE: CSS Grid and the New Autoprefixer | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! In Part 1 of this series, I debunked a few misconceptions that many people have around the Internet Explorer (IE) implementation of CSS grid. This article builds on that knowledge.
Saved
on: 2018-07-12
Essential Chrome Developer Tools: Beginner to Master
With the advent of modern frameworks, ES6 and the increasing risk of security everyday, knowing how to use Chrome developer tools can give you a major boost in productivity and help in easy diagnosis of a website’s performance.
Tags:
#webdev
Saved
on: 2018-07-09
Facebook post preview with ReactJS and AWS Lambda
I'm currently focused on learning more about React. For me, the best way to learn something is to build a small project that's not a todo list (lol).
Saved
on: 2018-07-05
Certificates for localhost
Sometimes people want to get a certificate for the hostname “localhost”, either for use in local development, or for distribution with a native application that needs to communicate with a web application.
Saved
on: 2018-06-20
15 Experts Share Their Web Performance Advice for 2018
A couple of years ago we reached out to a number of web performance experts in the community and asked them two questions about which performance tip they would recommend focussing on and what are some common performance mistakes.
Saved
on: 2018-06-08
Wired Elements
A set of common UI elements with a hand-drawn, sketchy look. These can be used for wireframes, mockups, or just the fun hand-drawn look. The elements are drawn with enough randomness that no two renderings will be exactly the same — just like two separate hand-drawn shapes.
Saved
on: 2018-05-25
Page Transitions for Everyone | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! As Sarah mentioned in her previous post about page transition using Vue.js, there is plenty of motivation for designers and developers to be building page transitions.
Saved
on: 2018-05-15
Chromium Blog: The State of the Web at Google I/O 2018
The introduction of the Service Worker API is one of the most significant improvements to the web in recent history. It frees developers from the limited lifecycle of pages, working in the background to intercept network requests and handle incoming events to enable web apps to work offline.
Tags:
#webdev
Saved
on: 2018-05-09
What's your tech stack?
It got me wondering what other peoples' stacks look like. Here's pretty much what our tech stack is where I currently work. What's your tech stack look like?
Saved
on: 2018-04-27
Running SSL on localhost
Before I get started with the how, I assume some of you may be asking, “Why do I care about running SSL on my localhost?” Well, there are some specific situations that you may care. Here are just a few: There may be others, but these are some that I have run into myself.
Saved
on: 2018-04-24
Which Podcasts Should Web Designers And Developers Be Listening To? — Smash
14 min read Share on Twitter, LinkedIn Advanced Design Systems, with Brad Frost Try monday dev for free! 11 Habits of Highly Effective Developers SmashingConf New York 2024 Try monday dev for free! Start with $100 Credits! Smart Interface Design Patterns, 10h video + UX training Podcasts for web de
Saved
on: 2018-04-19
How not to suffer with APIs – ITNEXT
Everyday I see the questions “How to work with API?”, “Can you give some best practices”, “How to cook axios” in frontend chats. They get a lot of answers but all of them can be reduced to three types Fatal mistake. Tons of boilerplate code guaranteed, I have nothing more to say
Saved
on: 2018-03-26
WebAIM: History of the browser user-agent string
In the beginning there was NCSA Mosaic, and Mosaic called itself NCSA_Mosaic/2.0 (Windows 3.1), and Mosaic displayed pictures along with text, and there was much rejoicing.
Saved
on: 2018-03-26
Simple A/B Testing with Google Optimize – Caffeina Developers
Google Optimize is a free tool for creating experiments for conversion rate testing. You set up experiments for various elements on your pages and then Google randomly serves the different versions of your pages to real visitors who come to your website.
Tags:
#webdev
Saved
on: 2018-03-20
5 Takeaways From Using Tailwind CSS In Real Projects | Nick Basile
Over the last few months, I've had the pleasure of writing a few blog posts covering how to build some simple components with Tailwind CSS.
Saved
on: 2018-03-16
Paseto is a Secure Alternative to the JOSE Standards (JWT, etc.) - Paragon
This is a follow-up to our 2017 blog post that made the case for avoiding JSON Web Tokens (JWT) and its related standards. Many developers responded to our post with the same question: "What should we use instead of JWT?" Today, I'm happy to announce a viable replacement.
Saved
on: 2018-03-05
How GDPR Will Change The Way You Develop — Smashing Magazine
Heather Burns 18 min read Privacy, Security, GDPR, Guides Share on Twitter, LinkedIn Smart Interface Design Patterns, 10h video + UX training Scalable CSS Masterclass, with Andy Bell UX Strategy Masterclass, with Vitaly Friedman SmashingConf Freiburg 2024 GDPR requires you to be more thoughtful abou
Saved
on: 2018-02-28
Frank Chimero · Everything Easy is Hard Again
This past summer, I gave a lecture at a web conference and afterward got into a fascinating conversation with a young digital design student. It was fun to compare where we were in our careers.
Saved
on: 2018-02-10
Here’s how Google Chrome’s new ad blocker works
Google Chrome will begin blocking ads on some websites by default on . I took a look at Chromium source-code to find out a bit more about how this new ad blocker will work.
Tags:
#webdev
Saved
on: 2018-02-04
Performance Calendar » Evolution of : Gif without the GIF
GIFs are awesome but terrible for quality and performance Replacing GIFs with <video> is better but has perf. drawbacks: not preloaded, uses range requests Now you can <img src=".
Saved
on: 2017-12-05
Browser Support for evergreen websites
I first used CSS when building a website involved taking a static image, chopping it up and reassembling it in order that it would hopefully cope with the fact that there might be more or less text than the designer expected. “Pixel perfect” meant “this website looks like this graphic”.
Tags:
#webdev
Saved
on: 2017-10-31
From Bootstrap to CSS Grid – Times Open
Despite many clever hacks and creative workarounds, there hasn’t been a simple answer for creating layout on the web. From misusing tables, to over-engineering simple floats that push around content, developers have consistently struggled to translate designs to code.
Saved
on: 2017-10-26
Rebuilding slack.com – Several People Are Coding
In August, we released a major redesign of slack.com, and we want to give you a peek behind-the-scenes. Rebuilding our marketing website was a massive project that took careful coordination across a variety of teams, departments, and agencies.
Saved
on: 2017-10-13
Reqres - A hosted REST-API ready to respond to your AJAX requests
No more tedious sample data creation, we've got it covered. Develop with real response codes. GET, POST, PUT & DELETE supported.
Saved
on: 2017-08-31
emadehsan/thal: Getting started with Puppeteer and Chrome Headless for Web
Puppeteer is official tool for Chrome Headless by Google Chrome team. Since the official announcement of Chrome Headless, many of the industry standard libraries for automated testing have been discontinued by their maintainers. Including PhantomJS.
Saved
on: 2017-08-29
Five sharding data models and which is right
Update in July 2023: Citus 12 allows you to shard your database by schema, or if you prefer, you can still use row-based sharding. Find out more in the Citus 12 blog post. When it comes to scaling your database, there are challenges but the good news is that you have options.
Saved
on: 2017-08-29
The Critical Request | CSS-Tricks
Serving a website seems pretty simple: Send some HTML, the browser figures out what resources to load next. Then we wait patiently for the page to be ready. Little may you know, a lot is going on under the hood.
Saved
on: 2017-08-02
Web Fundamentals | Web | Google Developers
Users don’t expect janky scrolling or slow load performance. Making your site fast is a process that starts with understanding how RAIL affects the performance of your site and how to use that to measure and improve your performance.
Tags:
#webdev
Saved
on: 2017-06-06
JSON-LD and Why I Hate the Semantic Web | The Beautiful, Tormented Machine
Tags:
#webdev
Saved
on: 2017-06-03
How to Use Laravel Mix in Non-Laravel Projects — SitePoint
This article was peer reviewed by Younes Rafie, Wern Ancheta, and Christopher Pitt. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be!
Saved
on: 2017-05-24
Rebuilding Slack’s Emoji Picker in React – Several People Are Coding
Slack is transitioning its web client to React. When Slack was first built, our frontend consisted of established technologies like jQuery and Handlebars. Since then, the community has developed better ways to create scalable, data-driven interfaces.
Saved
on: 2017-05-24
Rearchitecting Airbnb’s Frontend – Airbnb Engineering & Data Science – Medi
Overview: We recently rethought the architecture for the JavaScript side of our codebase at Airbnb. This post will look at (1) the product drivers that precipitated the changes, (2) the steps we took to move away from our legacy Rails solutions, and (3) some of the key pillars of the new stack.
Saved
on: 2017-05-16
Everything you need to know about HTTP security headers
Some physicists 28 years ago needed a way to easily share experimental data and thus the web was born. This was generally considered to be a good move.
Saved
on: 2017-05-16
REST Anti-Patterns
When people start trying out REST, they usually start looking around for examples – and not only find a lot of examples that claim to be “RESTful”, or are labeled as a “REST API”, but also dig up a lot of discussions about why a specific service that claims to do REST actually fails to do
Saved
on: 2017-05-10
Things to Use Instead of JWT | Kevin Burke
You might have heard that you shouldn't be using JWT. That advice is correct - you really shouldn't use it. In general, specifications that allow the attacker to choose the algorithm for negotiation have more problems than ones that don't (see TLS).
Saved
on: 2017-05-08
Dev.Opera — Responsive Images: Use Cases and Documented Code Snippets to Ge
We're excited to announce the launch of Opera One for iOS, our redesigned, AI-powered browser for iPhone. Opera is appealing the EU Commission’s decision not to designate Microsoft Edge as a gatekeeper, and requesting to keep freedom...
Saved
on: 2017-04-21
An off-grid social network
Scuttlebutt is slang for gossip, particularly among sailors. It is also the name of a peer-to-peer system ideal for social graphs, identity and messaging. Scuttlebutt was created by Dominic Tarr, a Node.
Saved
on: 2017-04-06
Apollo Client 1.0: A flexible, community-focused JavaScript GraphQL client
Today, we are proud to announce Apollo Client 1.0, “Pink Panther”! Apollo Client is now fully featured, stable and production-ready. If you’ve been holding off on trying GraphQL or Apollo, now’s a great time to check it out.
Saved
on: 2017-03-31
2016 Favorites | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! As the year closes, it’s good to reflect on all of the things we as a community have built, contemplated, and contributed to.
Saved
on: 2017-03-27
Advanced Web Scraping: Bypassing "403 Forbidden," captchas, and more | sang
The full code for the completed scraper can be found in the companion repository on github. I wouldn’t really consider web scraping one of my hobbies or anything but I guess I sort of do a lot of it.
Saved
on: 2017-03-16
donnemartin/system-design-primer
Help translate this guide! Learn how to design large-scale systems.
Saved
on: 2017-03-09
Optimising the front end for the browser
If you looked up optimisation (or optimization for our American readers) in the dictionary it would say something along the lines of Making the most of what we’ve got.
Saved
on: 2017-02-24
A Complete Guide to Flexbox | CSS-Tricks
The Flexbox Layout (Flexible Box) module (a W3C Candidate Recommendation as of October 2017) aims at providing a more efficient way to lay out, align and distribute space among items in a container, even when their size is unknown and/or dynamic (thus the word “flex”).
Saved
on: 2017-02-06
Online migrations at scale
Engineering teams face a common challenge when building software: they eventually need to redesign the data models they use to support clean abstractions and more complex features.
Saved
on: 2017-02-03
CSS Grid – Table layout is back. Be there and be square. | Web | Google
If you are familiar with Flexbox, Grid should feel familiar. Rachel Andrew maintains a great website dedicated to CSS Grid to help you get started. Grid is now available in Google Chrome. But alas, screens commonly have a second dimension we need to worry about.
Saved
on: 2017-02-01
Front-end Developer Handbook 2017 · GitBook
Forget building your own custom docs platform. With GitBook you get beautiful documentation for your users, and a branch-based Git workflow for your team.
Saved
on: 2017-01-31
CRAFT: Create React App From Template – Medium
If you’ve ever used create-react-app and wished you could customize the code it generates, read on. If you’ve never used create-react-app, start here.
Saved
on: 2017-01-30
Learning Test Driven Development
But I have one issue, all the methods he is testing are public.
Saved
on: 2017-01-30
Progressive Web Apps with Angular 2
Among other things, this post goes through how I set up offline support using the sw-precache and sw-toolbox libraries. Many updates and changes have been made to Angular tooling with regard to PWA support since this article was written.
Saved
on: 2017-01-19
SPF, DKIM & DMARC: email anti-spoofing technology history and future
This is the twenty fourth and final post in the 2016 FastMail Advent Calendar. Thanks for reading, and as always, thanks for using FastMail! Quick, where did this email come from and who was it sent to?
Saved
on: 2017-01-18
Print styles – A List Apart Sidebar – Medium
That sets the margins of printed pages in inches (I could’ve used centimetres but the numbers were nice and round in inches). The orphans: 4 declaration says that if there’s less than 4 lines on a page, shunt the text onto the next page.
Saved
on: 2016-12-28
What to learn in 2017 if you’re a frontend developer – Medium
With our fast-paced ecosystem we tend to spend our time trying the latest inventions and arguing about them on the internet.
Saved
on: 2016-12-28
Front-End Performance Checklist 2017 (PDF, Apple Pages) – Smashing Magazine
25 min read UX Design, Checklists, Performance Share on Twitter or LinkedIn Are you using progressive booting already? What about tree-shaking and code-splitting in React and Angular? Have you set up Brotli or Zopfli compression, OCSP stapling and HPACK compression? Also, how about resource hints,
Tags:
#webdev
Saved
on: 2016-12-22
Flexbox Froggy - A game for learning CSS flexbox
Reset 1 2 3 4 5 6 7 8 9 10 Flexbox Froggy is created by Codepip • YouTube • Twitter • GitHub • Settings Language Want to learn CSS grid? Play Grid Garden.
Saved
on: 2016-12-22
AngularJS by Unshift.xyz | ZEEF
Articoli, slide e video tutorials in italiano su Google AngularJS
Saved
on: 2016-11-17
A pattern for Continuously Deployed, Immutable and Stateful applications on
The diagram was created with Cloudcraft - Visualize your cloud architecture like a pro. The base template only contains the Route 53 Record Set that is used by the nodes to advertise their IP addresses. The node template contains a ASG, ENI and EBS Volume.
Saved
on: 2016-11-15
The Physical Web
Walk up and interact with any object -- a parking meter, a toy, a poster -- or location -- a bus stop, a museum, a store -- without installing an app first. Interactions are only a tap away.
Tags:
#webdev
Saved
on: 2016-11-07
» Responsive Images 101, Part 1: Definitions Cloud Four Blog
Over the last few years, we've written a quite a few articles about responsive images. Now that responsive images have landed in browsers, it seemed like a good time to step back and cover the basics for those who are just starting to tackle responsive images.
Saved
on: 2016-05-13
Keeping srcset and sizes under control | Matt Wilcox, Web Developer & Tinke
Saved
on: 2016-05-13
GitHub's CSS Performance // Speaker Deck
A talk on some problems solved related to CSS Performance at GitHub. The talk was given at CSS Dev Conference in Honolulu, HI 2012. I recorded the presentation from my laptop and posted it here https://vimeo.com/54990931
Saved
on: 2015-11-12
Accelerated Mobile Pages Project | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! The Accelerated Mobile Pages (AMP) Project is an initiative to improve the mobile web and enhance the distribution ecosystem.
Saved
on: 2015-10-14
httpbin(1): HTTP Client Testing Service
httpbin.org 0.9.2 [ Base URL: httpbin.org/ ] A simple HTTP Request & Response Service.
Saved
on: 2015-09-09
Picturefill
The picture element, srcset and sizes attributes, and associated features allow web developers to deliver an appropriate image to every user depending on a variety of conditions like screen size, viewport size, screen resolution, and more.
Tags:
#webdev
Saved
on: 2015-09-09
UpUp - The Offline First Library
Your users are no longer sitting at their desktops, with a wire connecting them to the internet. They are visiting your site from a phone in an elevator, from their tablet on the subway, or on their laptop while they sit cramped into seat 25 E.
Saved
on: 2015-09-02
sindresorhus/awesome
Your app, enterprise-ready. Start selling to enterprise customers with just a few lines of code.Add Single Sign-On (and more) in minutes instead of months.
Tags:
#webdev
Saved
on: 2015-08-14
minimaxir/big-list-of-naughty-strings
The Big List of Naughty Strings is an evolving list of strings which have a high probability of causing issues when used as user-input data. This is intended for use in helping both automated and manual QA testing; useful for whenever your QA engineer walks into a bar.
Tags:
#webdev
Saved
on: 2015-08-11
Nginx with dynamic upstreams - Tenzer.dk
Posted on July 26, 2015. Reading time: 5 minutes I recently made a setup at work where I had a Nginx server facing the user, which would forward requests to a service running behind an AWS Elastic Load Balancer (aka. ELB).
Saved
on: 2015-07-27
google/material-design-lite · GitHub
An implementation of Material Design components in vanilla CSS, JS, and HTML. Material Design Lite (MDL) lets you add a Material Design look and feel to your static content websites. It doesn't rely on any JavaScript frameworks or libraries.
Saved
on: 2015-07-06
Locust - A modern load testing framework
Define user behaviour with Python code, and swarm your system with millions of simultaneous users. I'm impressed not more people talk about locust (http://locust.io/). The thing is awesome :) Shoutout too the guys from ESN :)
Saved
on: 2015-07-01
Tips for Writing Modular CSS Matt Lambert
No matter how much you love CSS, no one enjoys writing or maintaining style sheets that are 2000+ lines of awesomeness. The smart way to approach your CSS is from a modular stand point.
Saved
on: 2015-05-26
Documentation - Materialize
We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers.
Saved
on: 2015-04-24