euler + webdev   905

Introducing Clarity, a product to visualize user interactions at scale to optimize conversion, engag | Webmaster Blog
Today, we are announcing the beta release of Clarity, an analytics product that empowers webmasters to visualize user behavior at scale to make data driven decisions on what exactly they should change and improve on their sites to optimize conversion, engagement and retention.  For this purpose, Clarity supports playback of how users interacted and used their websites. Clarity also has other typical functionalities such as heatmap and scroll map.
webdev  instrumentation  analytics 
3 days ago by euler
How I built an app with Vulcan.js in four days – freeCodeCamp.org
Day 1: Picking our spaceship
Meet Vulcan.js, aka Meteor-on-steroids
Meteor is a famous full-stack JavaScript framework. From its very beginning, it has always emphasized productivity and developer experience. It pioneered many awesome features and patterns, like isomorphic development (reuse the same code server side and client side).
Vulcan.js is basically the good elements of Meteor, plus the good elements of the JavaScript ecosystem, in a single framework. It relies on the latest technologies: React for the frontend, and Apollo (GraphQL) for client/server communication.
webdev  vulcan.js 
5 days ago by euler
Immutable Web Apps
Introduction

Immutable Web Applications is a framework-agnostic methodology for building and deploying static single-page applications that:

Minimizes risk and complexity of live releases.
Simplifies and maximizes caching.
Minimizes the need for servers and administration of runtime environments.
Enables continuous delivery through simple, flexible, atomic deployments.
Principles

The methodology is based on the principles of strictly separating:

Configuration from code.
Release tasks from build tasks.
Dynamic content from static content.
webdev  architecture  deployment 
11 days ago by euler
What is web.dev?  |  web.dev
What is web.dev?
web.dev is the ultimate resource for developers of all backgrounds to learn, create, and solve on the web. It's meant to not only educate developers, but help them apply what they've learned to any site they work on, be it personal or business.

web.dev was borne of a belief that if we make high quality experiences easy to build, it will enable more meaningful engagement on the web—for users and developers alike. Simply put, we realized the only way the web gets better is if we help the people building it succeed.

And the web can be better.
webdev  Education  trend 
12 days ago by euler
Lwan Web Server
With its low disk and memory footprints, it's suitable to be used from embedded devices to robust servers. Both static and dynamic content can be served, as it can also be used as a library. Dynamic content can be generated by code written in either C or Lua.
webserver  lua  webdev 
20 days ago by euler
Advanced web security topics – George's Techblog
(Last update 28 February 2018) This post discusses web security issues that I come across – so far thankfully mostly by reading about them. It is a work in progress which I’ll keep updating. The post title includes “advanced” because the topics discussed here involve clever, non-trivial hacks, are novel at the time of their publication and often combine features with non-obvious consequences.
webdev  Security 
22 days ago by euler
Archiving web sites [LWN.net]
I recently took a deep dive into web site archival for friends who were worried about losing control over the hosting of their work online in the face of poor system administration or hostile removal. This makes web site archival an essential instrument in the toolbox of any system administrator. As it turns out, some sites are much harder to archive than others. This article goes through the process of archiving traditional web sites and shows how it falls short when confronted with the latest fashions in the single-page applications that are bloating the modern web.
webdev  archiving 
23 days ago by euler
The Virtual DOM is slow. Meet the Memoized DOM – freeCodeCamp.org
This is a quote from someone who read through an early draft of this article, and I would like to tackle it head on. The performance difference is not limited to a simple test, quite the contrary. Imba has been used in production for several years at scrimba.com, but it is still not for the faint of heart. For most developers the massive ecosystems for Vue and React will be hard (and probably unwise) to leave behind. The Imba documentation still leaves a lot to be desired, but we are improving it every day.
webdev  react  imba  framework 
27 days ago by euler
GitHub - scripting/likes: A simple likes server for the web running in Node.
nodeLikes

A simple Node-based server that manages likes across arbitrary web pages. Includes JavaScript code for clients that interfaces with the server.
webdev  bookmarks  likes  node.js 
28 days ago by euler
How to Learn Vue.js in 2018
Vue.js is one of the hottest topics in the web frontend space.

Vue has skyrocketed past React to become the most starred JavaScript framework on Github.

It was also the framework that the most JavaScript developers said they wanted to learn in 2018.

The big question is: How do you learn Vue.js?

What are the best resources? What sources should you be reading, what classes should you be taking, and more?
webdev  vue.js 
4 weeks ago by euler
Headless WordPress: The Ups And Downs Of Creating A Decoupled WordPress — Smashing Magazine
Ever since REST API was bundled in the WordPress core, developers can experiment and use it in a decoupled way, i.e. writing the front-end part by using JavaScript frameworks or libraries. At Infinum, we were (and still are) using WordPress in a ‘classic’ way: PHP for the frontend as well as the backend. After a while, we wanted to give the decoupled approach a go. In this article, I’ll share an overview of what it was that we wanted to achieve and what we encountered while trying to implement our goals.
wordpress  headless  API  webdev 
4 weeks ago by euler
11 React UI Component Playgrounds for 2018 – Bits and Pieces
Useful online playgrounds and editors for your UI components
react  UI  playground  Javascript  webdev 
7 weeks ago by euler
Hello p5.js Web Editor! – Processing Foundation – Medium
Visit editor.p5js.org to begin making a project. You can start with one of the many examples, or start from scratch. It is free and the open source, no sign up, setup, or download required. Using p5.js you can use JavaScript, HTML, and CSS to create graphics in 2D and 3D, add text, images, video, and audio, and make your sketch interactive with mouse, touch, webcam input, and motion sensing.
processing  graphics  webdev  IDE  editor  tools 
7 weeks ago by euler
Jauntium - Java Browser Automation for Webscraping and Automated Testing
Jauntium is a new, free Java library that allows you to easily automate Chrome, Firefox, Safari, Edge, IE, and other modern web browers. With Jauntium, your Java programs can perform web-scraping and web-automation with full javascript support. The library is named 'Jauntium' because it builds on both Jaunt and Selenium to overcome the limitations of each. Jauntium makes it easy to:
create web-bots or web-scraping programs
access the DOM
work with tables and forms
write automated tests for your website or web application
add Jaunt-like functionality to your existing Selenium project (how)
webdev  automation  java 
11 weeks ago by euler
Show HN: Thi.ng/hdom – S-expression based, pure ES6 UI/VDOM components | Hacker News
https://github.com/thi-ng/umbrella/blob/master/packages/hdom...
Lightweight UI component tree definition syntax, DOM creation and differential updates using only vanilla JS data structures (arrays, iterators, closures, attribute objects or objects with life cycle functions, closures). By default targets the browser's native DOM, but supports other arbitrary target implementations in a branch-local manner, e.g. to define scene graphs for a canvas element as part of the normal UI tree.
Javascript  webdev  GUI  components 
11 weeks ago by euler
Chromium Blog: 10 Years of Chrome DevTools
Chrome is turning 10! Thank you for making the web development community so open, collaborative, and supportive. DevTools draws inspiration from countless other projects. Here’s a look back at how DevTools came about, and how it’s changed over the years.
webdev  tools  history  culture 
september 2018 by euler
Flow: A Static Type Checker for JavaScript
CODE FASTER.
Tired of having to run your code to find bugs? Flow identifies problems as you code. Stop wasting your time guessing and checking.
webdev  proglang  Javascript  types 
september 2018 by euler
Elastos | Smartweb Powered by Blockchain
What is Elastos?
Elastos is the safe and reliable internet of the future. Built utilizing the blockchain, this technological breakthrough provides the first completely safe environment on the web where decentralized applications are detached from the internet while also permitting full scalability to millions of users. Elastos enables the generation of wealth through ownership and exchange of your data and digital assets. Welcome to the new Smart Web, where safety and economic distribution can flourish on the internet.
decentralized  distributed  webdev  blockchain 
august 2018 by euler
Who Left Open the Cookie Jar? A Comprehensive Evaluation of Third-Party Cookie Policies (PDF)
In this paper, we evaluate the effectiveness of these defense mechanisms by leveraging a framework that au- tomatically evaluates the enforcement of the policies im- posed to third-party requests. By applying our frame- work, which generates a comprehensive set of test cases covering various web mechanisms, we identify several flaws in the policy implementations of the 7 browsers and 46 browser extensions that were evaluated. We find that even built-in protection mechanisms can be circum- vented by multiple novel techniques we discover. Based on these results, we argue that our proposed framework is a much-needed tool to detect bypasses and evaluate solu- tions to the exposed leaks.
webdev  security  cookies 
august 2018 by euler
Vue CLI 3: A Game Changer For Frontend Development
The astonishing rise of Vue’s popularity over the past year has highlighted what developers really care about in a framework: performance, flexibility, and ease of use.

As you’ll see, Vue CLI 3 is a major leap forward in both flexibility and ease of use. It provides your Vue project with instant access to the best build tools from the frontend world, combining them seamlessly with sensible defaults. At the same time, it allows easy configuration and customization to fit your specific needs.

To achieve this, Vue CLI 3 has adopted a new plugin-based architecture, departing from the template-based architecture of versions 1 and 2. Under this new architecture, project configuration is siloed in independent plugins i.e. one for TypeScript, one for ESLint etc.
webdev  frontend  vue.js 
august 2018 by euler
GitHub - runkids/Imagvue: Imagvue is a image processing component for Vue.js
Imagvue provides basic image processing props(size,blur,contrast,grayscale, etc.).

Support image lazy loading.

All Attributes can bind with data
webdev  imageProcessing  vue.js 
august 2018 by euler
Web Typography Resources for Web Designers and Web Developers | Better Web Type
A growing list of web typography related apps, tools, plugins and other resources for web designers and web developers.
webdev  typography 
august 2018 by euler
GitHub - chinedufn/percy: A modular toolkit for building isomorphic web apps with Rust + WebAssembly
See Also

virtual-dom - a JavaScript virtual-dom implementation that I took inspiration from.

How to write your own Virtual DOM - helped me better understand how a virtual-dom works.

Sheetify inspired the css! macro
rust  wasm  webdev 
july 2018 by euler
GitHub - jeeliz/jeelizPupillometry: Real-time pupillometry in the web browser using a 4K webcam video feed processed by this WebGL/Javascript library. A demo experiment is included.
Pupillometry in the web browser

This JavaScript library detects, tracks and measures the radius of the 2 pupils of the eyes of the user. It uses a standard 4K webcam and it runs into the web browser, fully client side. It fully uses the GPU hardware acceleration thanks to WebGL, for each computation step :

for head detection (using a deep neural network),
for iris segmentation (using Circle Hough Transform),
for Pupil segmentation (using a custom ray tracing algorithm)
for debug rendering
This library is lightweight : it captures the image of the webcam and gives the relative radiuses of the 2 pupils as output (ie (radius of the pupil)/(radius of the iris). It does not include a measurement recorder or a chart plotter. We want to keep it framework agnostic so it is integrable into all environments. We have included a light plotter and a light recorder among the helper scripts in the helpers path for the demonstrations.
webgl  webdev 
july 2018 by euler
How Image Optimisation Decreased my Website's Page Weight by 62%
Compressing images is all about reducing file size while maintaining an acceptable level of visual quality. To compress the images on my site, imagemin was my tool of choice.

To use imagemin, make sure you have Node.js installed then open a terminal window, cd into your project’s folder and run the following command:
compression  imageProcessing  webdev  node.js 
july 2018 by euler
Fathom · simple, trustworthy website analytics
Fathom does just that. It tracks users on a website (without collecting personal data) and give you a non-nerdy breakdown of your top content and top referrers. It does so with user-centric rights and privacy, and without selling, sharing or giving away the data you collect. It's a simple and easy to use for website owners at any technical level.
webdev  analytics  golang 
july 2018 by euler
Visualization of Road Network Reachability with deck.gl - GraphHopper Directions API
With the GraphHopper Isochrone API it is possible to create polygons of areas that you can reach from a certain location in e.g. 10 minutes for different modes of transport, like car or walking. This is useful for a number of purposes like finding the best location for a new supermarket or the valuation of a building area. Read more about Isochrone maps at wikipedia.
mapping  gis  routing  webgl  webdev 
july 2018 by euler
GitHub - kay-is/react-from-zero: A simple (99% ES2015 less) tutorial for React
React From Zero

A simple (99% ES2015 less) tutorial for React

Everything runs in the browser without a manual pre-compilation.
webdev  Javascript  react  Tutorial 
june 2018 by euler
The Book
Help yourself! It's all free and CC-licenced (thanks O'Reilly!). I see this as a "try-before-you-buy" scheme, and I hope that if you enjoy it you'll buy a copy -- if not for yourself, then perhaps for a friend!

Table of contents follows:
webdev  python  book 
june 2018 by euler
How to use Cloudfront for Secure Delivery of Static Websites Around the World
In this post you are going to learn how to leverage another Amazon Web Services (AWS) offering, CloudFront. In five simple and easy steps you can leverage CloudFront for low latency, security, and simple delivery of your static website.
cloudfront  aws  static  webdev 
june 2018 by euler
Sing App - Bootstrap 4 Admin Dashboard Template
Available in Many Versions
Sing App supports leading JavaScript frameworks such as Bootstrap, React and Angular to match latest industry demands
dashboard  bootstrap  template  webdev 
june 2018 by euler
Strapdown.js - Instant and elegant Markdown documents
Strapdown.js
Strapdown.js makes it embarrassingly simple to create elegant Markdown documents. No server-side compilation required. Use it to quickly document your projects, create tutorials, home pages, etc. (For example, the page you are reading was generated by Strapdown).

Simply copy the HTML template below and drop it on any static file server:
markdown  webdev  Javascript  hosting 
june 2018 by euler
TensorFlow.js — a practical guide – YellowAnt
Recently, Google introduced it’s most popular machine learning library: TensorFlow in Javascript. With the help of TensorFlow.js one can train and deploy ML models in the browser.
ai  ml  tensorflow  Javascript  webdev 
june 2018 by euler
GitHub - Netflix/pollyjs: Record, Replay, and Stub HTTP Interactions.
Polly.JS is a standalone, framework-agnostic JavaScript library that enables recording, replaying, and stubbing HTTP interactions.

Polly taps into native browser APIs to mock requests and responses with little to no configuration while giving you the ability to take full control of each request with a simple, powerful, and intuitive API.
Javascript  webdev  testing 
june 2018 by euler
A Guide to Wireframe Tools & Rapid Prototyping - UX Tricks
Quick summary

Going to straight to high-fidelity is an epic waste of time, money, and resources. Wireframing and rapid prototyping ensures that we iterate and validate our ideas first.
What you'll learn

How to waste money
Rapid prototyping
Why wireframes
Gathering feedback
Wireframe and prototyping tools
webdev  prototype  wireframes 
june 2018 by euler
BCHS: BSD, C, httpd, SQLite
Articles, conference talks…
have more links? let us know.

Role audits with kwebapp
2018/03
RBAC in BCHS (PDF, video)
AsiaBSDCon, 2018/03
API provisioning with kwebapp
2017/10
Should I use the BCHS web stack?
EuroBSDCon short answer, 2017/09
Split-process ksql
2017/07
Rapid web applications with kwebapp
2017/05
Secure CGI
AsiaBSDCon, 2017/03
BCHS sandboxing with pledge
2016/11
Using JSON with BCHS
2016/10
Secure CGI Applications in C on BSD
AsiaBSDCon, 2016/03
bsd  webdev  stack 
june 2018 by euler
Open Sourcing Zuul 2 – Netflix TechBlog – Medium
Open Sourcing Zuul 2
We are excited to announce the open sourcing of Zuul 2, Netflix’s cloud gateway. We use Zuul 2 at Netflix as the front door for all requests coming into Netflix’s cloud infrastructure. Zuul 2 significantly improves the architecture and features that allow our gateway to handle, route, and protect Netflix’s cloud systems, and helps provide our 125 million members the best experience possible. The Cloud Gateway team at Netflix runs and operates more than 80 clusters of Zuul 2, sending traffic to about 100 (and growing) backend service clusters which amounts to more than 1 million requests per second. Nearly all of this traffic is from customer devices and browsers that enable the discovery and playback experience you are likely familiar with.
This post will overview Zuul 2, provide details on some of the interesting features we are releasing today, and discuss some of the other projects that we’re building with Zuul 2.
How Zuul 2 Works
Zuul  Netflix  webdev 
may 2018 by euler
Datasette Facets
Datasette lets you deploy an instant web UI and JSON API for any SQLite database. csvs-to-sqlite makes it easy to create a SQLite database out of any collection of CSV files. Datasette Publish is a web app that can run these combined tools against CSV files you upload from your browser. And now the new Datasette Facets feature lets you explore any CSV file using faceted navigation with a couple of clicks.
csv  json  sqlite  webdev  gui 
may 2018 by euler
Scraping Framework for Golang
Colly provides a clean interface to write any kind of crawler/scraper/spider

With Colly you can easily extract structured data from websites, which can be used for a wide range of applications, like data mining, data processing or archiving.

Features

Clean API
Fast (>1k request/sec on a single core)
Manages request delays and maximum concurrency per domain
Automatic cookie and session handling
Sync/async/parallel scraping
Distributed scraping
Caching
Automatic encoding of non-unicode responses
Robots.txt support
Google App Engine support
golang  archiving  webdev  scraping 
may 2018 by euler
Home - Proton Native - React Native for the desktop, cross compatible
Features
Same syntax as React Native
Works with existing React libraries such as Redux
Cross platform
Native components. No more Electron
Compatible with all normal Node.js packages
desktop  native  react  javascript  app  webdev 
may 2018 by euler
GitHub - toddwschneider/stocks: A free, lightweight, blazing-fast static page to get stock quotes using the IEX API
A free, lightweight, blazing-fast static page to get stock quotes using the IEX API. Stocks can be grouped into user-defined portfolios. Quotes update every 10 seconds. No API key required. Everything is contained within index.html, there are no external javascripts or stylesheets to load.

See here for a live demo: http://toddwschneider.com/stocks/
finance  stocks  webdev  iex 
april 2018 by euler
Tom Black — Ruby on WebAssembly
Lastly, I’ll just say that the line between what a “native” and “web” app will continue to be blurred. Progressive web apps and other approaches will mean that we developers get the best of both worlds, and end users will enjoy better experiences on the web, and with desktop and mobile apps that use web technologies. I imagine the conversations we’ll have around “Is it possible?” will be quite short (almost always, yes). Rather, the ones concerning “Is it good and how do we know?” will be much more lengthy and difficult. Who knows where we’ll end up — it’ll surely be a captivating journey.
webassembly  ruby  webdev  trend  llvm 
april 2018 by euler
How to Build a Real-time Editable Datagrid In React
A datagrid enables you to display and edit data. This is a vital feature in most data-driven applications.
You may have implemented this in one of your React apps in the past. Maybe you used libraries like react-bootstrap-table, react-grid, or react-table. With those, you can add a Datagrid to your React app. But what if you want the changes to be done in real-time and updates synchronized across all connected devices and their browsers?
In this article, I will show you how to build a real-time datagrid in React using react-table and Hamoni Sync.
webdev  react  datagrid 
april 2018 by euler
Instant Production-Ready Scaffolding With Create-Static-Site | Forestry.io
Create React App is a utility provided by the Facebook team in support of the React JavaScript framework. The goal of Create React App is to allow developers to quickly bootstrap a React project without having to spend time sorting out the build pipeline. With over 47,000 stars on Github (over half as many as the actual React library,) Create React App’s popularity speaks for itself.

The success and utility of Create React App has inspired the Forestry.io community to create a similar project for scaffolding static sites. Create Static Site is a tool that can set up a new Hugo or Jekyll site with a modern, production-ready build pipeline in seconds.
webdev  react  static 
april 2018 by euler
Making a Web Thing on the ESP8266 – Mozilla Hacks – the Web developer blog
Today I’m going to walk you through creating a simple Web Thing using an inexpensive off-the-shelf ESP8266 board.
esp8266  webdev  iot  embedded 
april 2018 by euler
D3 in Depth
About

D3 in Depth aims to bridge the gap between introductory tutorials/books and the official documentation.

It focuses on version 4 of D3.

D3 in Depth is written by Peter Cook.
visualization  book  D3  webdev  graphics 
april 2018 by euler
VuePress
Simplicity First

Minimal setup with markdown-centered project structure helps you focus on writing.

Vue-Powered

Enjoy the dev experience of Vue + webpack, use Vue components in markdown, and develop custom themes with Vue.

Performant

VuePress generates pre-rendered static HTML for each page, and runs as an SPA once a page is loaded.
webdev  static  vue.js 
april 2018 by euler
A DevTools for Designers – UX Collective
2018: The golden age of prototyping?
To return to Jeffrey Zeldman’s 2010 article, he concluded at that time by saying “no company will ever create the modern-day equivalent of Illustrator and PageMaker” for the web, citing the fact that crafting good code requires “professionalism, wisdom, and experience.”
Four years later, he interviewed Tom Attanasio from Macaw on the Big Web Show podcast. Zeldman described that brand-new app as “the superhot web design tool of the future.” Macaw has since been acquired by Invision, as the foundation of their forthcoming Studio app.
Until Studio comes out of NDA, I can’t say for sure if it will meet its hype, or designers’ expectations, but it’s not hype to say we are now living in a Golden Age of visual prototyping tools.
The Prototypr blog lists the current state of the field here.
design  tools  prototype  webdev 
april 2018 by euler
Top 21 Prototyping Tools For UI And UX Designers 2018
In this article, I’ll introduce you prototyping tools which will help you design & iterate faster.
design  tools  prototype  webdev 
april 2018 by euler
VideoContext/README.md at master · bbc/VideoContext · GitHub
VideoContext

The VideoContext is an experimental HTML5/WebGL media processing and sequencing library for creating interactive and responsive videos on the web.

It consist of two main components. A graph based, shader accelerated processing pipeline, and a media playback sequencing time-line.

The design is heavily inspired by the WebAudioAPI so should feel familiar to use for people who've had previous experience in the WebAudio world.

Live examples can be found here
video  videoediting  webdev  WebGL 
april 2018 by euler
Popmotion Pose - A declarative animation library for HTML, SVG and React
CSS simplicity meets Popmotion power
Zero-config animation

By default, Pose will figure out the animation based on the properties being animated.
webdev  animation  css  react 
march 2018 by euler
Server.js
The package server is great for many situations. Let's see some of them:

Small to medium projects
Everything works out of the box, you get great support for most features and you can easily tap into Express' middleware ecosystem. What's not to love?

Some of the included features: body and file parsers, cookies, sessions, websockets, Redis, gzip, favicon, csrf, SSL, etc. They just work so you will save a headache or two and can focus on your actual project. Get a simple form going:
node  node.js  server  webdev 
march 2018 by euler
How to Make an AWS S3 Static Website With SSL
Here were my technical requirements for this site:

Hosted totally in an Amazon S3 Bucket (i.e. no servers/ec2/PaaS cost)
Free SSL support
Ease of writing blog posts
After some consideration, I settled on using the following technologies:

source control: Git/Github
blogging platform/CMS: jekyll
DNS: Amazon Route53
deployment: aws s3 cli bucket sync service
SSL: free Amazon Cerfificate Management Service Cert securing an Amazon CloudFront distribution (CDN) that sits in front of the s3 bucket
Google Analytics for analytics/tracking
Disqus (comment below!) for comments
I will now describe how this is all sewn together.
aws  s3  blogging  webdev  ssl 
march 2018 by euler
GitHub - bnb/awesome-developer-streams: 👩🏿‍💻👨🏾‍💻👩🏼‍💻👨🏽‍💻👩🏻‍💻 Awesome Developers, Streaming
PROTIP: Search this page for subjects you'd be interested in watching live, like JavaScript, DataViz, IoT, Rust, and so on. You'll get an index of streamers relevant to your interests–be sure to follow them! ❤️
videos  streaming  learning  development  webdev 
march 2018 by euler
30 Seconds of CSS
30 Seconds of CSS
A curated collection of useful CSS snippets you can understand in 30 seconds or less.
css  resources  snippets  webdev 
march 2018 by euler
Towards web-based delta synchronization for cloud storage systems | the morning paper
Evaluation
The client side of WebR2sync+ is 1700 lines of JavaScript. The server side is based on node.js (about 500 loc) and a set of C processing modules (a further 1000 loc).

Comparing the red and green (bottom two) lines in the charts below, you can see that WebR2sync+ has sync times approaching those of rsync:
webdev  Javascript  rsync  webrsync 
march 2018 by euler
What I learnt from building 3 high traffic web applications on an embedded key value store.
In a nutshell
Embedded key value stores give you all the advantages of a nosql database, but where it is lacking is in search, since you’re only able to query for items by their keys and key’s prefix. But when paired with an indexing engine like blevesearch in golang, or elasicsearch and lucene, the pair gives you a very capable database with features like full text search, location based search, etc in a very resource efficient package and scales well.
I believe this pair should have more popularity than it actually currently has, and go a long in reducing server expenses especially with applications which never expect facebook level scale.
webdev  scale  Database  keyvalue  architecture 
march 2018 by euler
Web application from scratch, Part I · Bogdan Popa
This is the first in a series of posts in which I’m going to go through the process of building a web application (and its web server) from scratch in Python. For the purposes of this series, I’m going to solely rely on the Python standard library and I’m going to ignore the WSGI standard.

Without any further ado, let’s get to it!
http  webdev  introduction  python 
february 2018 by euler
Understanding the Limitations of HTTPS | text/plain
A colleague recently forwarded me an article about the hazards of browsing on public WiFi with the question: “Doesn’t HTTPS fix this?” And the answer is, “Yes, generally.” As with most interesting questions, however, the complete answer is a bit more complicated.

HTTPS is a powerful technology for helping secure the web; all websites should be using it for all traffic.

If you’re not comfortable with nitty-gritty detail, stop reading here. If your takeaway upon reading the rest of this post is “HTTPS doesn’t solve anything, so don’t bother using it!” you are mistaken, and you should read the post again until you understand why.

HTTPS is a necessary condition for secure browsing, but it is not a sufficient condition.

There are limits to the benefits HTTPS provides, even when deployed properly. This post explores those limits.
webdev  privacy  Security  https 
february 2018 by euler
Carrot Creative - Coding - Building a Static CMS
As a result, we've replaced a lot of our typical database driven CMS projects with static builds. These projects were primarily content based and only required infrequent updates to add or remove content. It didn't make sense to build out so much infrastructure (database, hosting, caching, monitoring, code logic, admin interface, etc) for sites that are mostly responding to requests with the same HTML over and over.
webdev  static  resources 
february 2018 by euler
Back to static: a paradigm shift for better UX and web performance
For several years now, a new range of solutions have emerged in the web technologies landscape. Static site generators, headless CMS, content infrastructure... these solutions contribute to a global trend. "Static trend", "JAMStack", several names exist but none really covers what is an overall new proposal for web application architecture, and somehow a comeback to the roots of the Web.
static  webdev  tools  resources 
february 2018 by euler
This page weighs 15kb - macwright.org
Further reading
Measurement: The Timeline tool and PageSpeed are essential, webpagetest is a godsend.
Books: Steve Souder’s book High Performance Web Sites and follow-up Even Faster Websites are the best web performance-optimization advice you’ll find in book form. Lara Hogan’s Designing for Performance is potentially even better for navigating the balance between design and engineering.
Monitoring over time: SpeedCurve, pingdom, and Calibre provide different ways to quantify how much faster you’re making your webpages.
webdev  performance 
february 2018 by euler
Modern CSS Explained For Dinosaurs – Actualize – Medium
The goal of this article is to provide a historical context of how CSS approaches and tooling have evolved to what they are today in 2018. By understanding this history, it will be easier to understand each approach and how to use them to your benefit. Let’s get started!
css  webdev  history 
february 2018 by euler
Google Cloud Platform Blog: 12 best practices for user account, authorization and password management
Account management, authorization and password management can be tricky. For many developers, account management is a dark corner that doesn't get enough attention. For product managers and customers, the resulting experience often falls short of expectations.
Fortunately, Google Cloud Platform (GCP) brings several tools to help you make good decisions around the creation, secure handling and authentication of user accounts (in this context, anyone who identifies themselves to your system — customers or internal users). Whether you're responsible for a website hosted in Google Kubernetes Engine, an API on Apigee, an app using Firebase or other service with authenticated users, this post will lay out the best practices to ensure you have a safe, scalable, usable account authentication system.
google  webdev  Security  authentication 
february 2018 by euler
javascript/README.md at master · airbnb/javascript · GitHub
Airbnb React/JSX Style Guide

A mostly reasonable approach to React and JSX
react  webdev 
january 2018 by euler
The Brutal Lifecycle of JavaScript Frameworks - Stack Overflow Blog
Using the Stack Overflow Trends tool and some of our internal traffic data, we decided to take a look at some of the more prominent UI frameworks: Angular, React, Vue.js, Backbone, Knockout, and Ember.

Framework lifecycle

Stack Overflow Trends lets us examine how each of these technologies has been asked about over time. We can start by looking at some of the larger frameworks.
webdev  trends  Javascript  framework 
january 2018 by euler
Pagination Tunnels - An Experiment in Crawlability and Click Depth - Portent
In the end, the point of this experiment and exploration was to shine some light on an often-neglected part of most websites, and to show that small changes to your pagination can have a surprisingly large impact on how a crawler sees your site and all that wonderful content.
webdev  seo  pagination 
january 2018 by euler
WebGL2 Fundamentals
WebGL2 from the ground up. No magic.

These are a set of articles that teach WebGL2 from basic principles. They are NOT old rehashed out of date OpenGL articles like many others on the net. They are entirely new, discarding the old out of date ideas and bringing you to a full understanding of what WebGL really is and how it really works.

These articles are specifically about WebGL2. If you are interested in WebGL 1.0 please go here If you are already familar with WebGL1 you might want to look at these articles
WebGL2  graphics  webdev 
january 2018 by euler
GitHub - scripting/pagePark: I wrote this simple Node.js folder-based HTTP server that serves static and dynamic pages for domains I've bought but not yet used.
I wrote this simple HTTP server to park domains I've bought but not yet used. But I kept going and added all the features I want to help me manage my own websites, far beyond just parking them. But I liked the name so I kept it. Think of it as a nice park where you keep your pages. ;-)

It's written in JavaScript and runs in Node.js.

Each domain is in its own folder. The content for that domain is in the folder. I went a little wild with content types, it can serve Markdown docs, or run JS code. And of course HTML, text files, images, movies, etc.
webdev  server 
january 2018 by euler
Essential Image Optimization
Everyone should be compressing their images efficiently.
At minimum: use ImageOptim. It can significantly reduce the size of images while preserving visual quality. Windows and Linux alternatives are also available.
More specifically: run your JPEGs through MozJPEG (q=80 or lower is fine for web content) and consider Progressive JPEG support, PNGs through pngquant and SVGs through SVGO. Explicitly strip out metadata (--strip for pngquant) to avoid bloat. Instead of crazy huge animated GIFs, deliver H.264 videos (or WebM for Chrome, Firefox and Opera)! If you can’t at least use Giflossy. If you can spare the extra CPU cycles, need higher-than-web-average quality and are okay with slow encode times: try Guetzli.
webdev  image  optimization  performance  compression  automation 
january 2018 by euler
jsonTree
jsonTree is a lightweight dependency-free javascript micro-library for creating collapsable tree-lists from a JSON file. If you want to see it in action, please check the example.

I created jsonTree because everything I found on creating collapsable lists was either too big (in terms of both filesize and functionality) or required JQuery (which is another matter altogether). jsonTree provides an infrastructure for the developer to stylize and do with as they please.
webdev  json  jsontree  tree 
january 2018 by euler
GitHub - aws/aws-amplify: A declarative library for application development using Cloud services with JavaScript
AWS Amplify is a JavaScript library for frontend and mobile developers building cloud-enabled applications. The library is a declarative interface across different categories of operations in order to make common tasks easier to add into your application. The default implementation works with Amazon Web Services (AWS) resources but is designed to be open and pluggable for usage with other cloud services that wish to provide an implementation or custom backends.
webdev  react  aws 
january 2018 by euler
GitHub - stereobooster/react-snap: 👻 Zero-configuration framework-agnostic static prerendering for SPAs
Pre-renders web app into static HTML. Uses headless chrome to crawl all available links starting from the root. Heavily inspired by prep and react-snapshot, but written from scratch. Uses best practices to get best loading performance.
static  webdev  react 
january 2018 by euler
The GraphQL stack: How everything fits together – Apollo GraphQL
It’s been over 2 years since GraphQL was released as an open source technology by Facebook. Since then, the community has grown exponentially, and there are now thousands of companies using GraphQL in production. At this October’s GraphQL Summit 2017, I had the privilege of giving the opening keynote on the second day. You can watch the full talk on YouTube, or read this post to get a quick overview.
graphql  architecture  webdev  trend 
january 2018 by euler
Sapper: Towards the ideal web app framework
The compiler-as-framework paradigm shift
Svelte introduced a radical idea: what if your UI framework wasn't a framework at all, but a compiler that turned your components into standalone JavaScript modules? Instead of using a library like React or Vue, which knows nothing about your app and must therefore be a one-size-fits-all solution, we can ship highly-optimised vanilla JavaScript. Just the code your app needs, and without the memory and performance overhead of solutions based on a virtual DOM.

The JavaScript world is moving towards this model. Stencil, a Svelte-inspired framework from the Ionic team, compiles to web components. Glimmer doesn't compile to standalone JavaScript (the pros and cons of which deserve a separate blog post), but the team is doing some fascinating research around compiling templates to bytecode. (React is getting in on the action, though their current research focuses on optimising your JSX app code, which is arguably more similar to the ahead-of-time optimisations that Angular, Ractive and Vue have been doing for a few years.)

What happens if we use the new model as a starting point?
webdev  framework  trend 
january 2018 by euler
« earlier      
per page:    204080120160

related tags

3d  a-frame  accessibility  accesskey  ace  adobe  advertising  ai  air  ajax  amp  anaimation  analytics  android  angular  angular.js  animation  annotation  apache  api  apollo  app  appengine  applications  apps  appserver  aptana  arc  arch  architecture  archiving  ascii  asm.js  assembly  async  atompub  audio  authentication  autocomplete  automation  autosave  aws  b2g  backbone  backbone.js  barcodes  batman.js  bcap  belay  benchmark  billing  bioinformatics  ble  blender  blockchain  blogging  bluefish  bluetooth  boilerplate  book  bookmarking  bookmarklet  bookmarks  bootstrap  brackets  browser  browsercache  browserfy  brunch  bsd  business  c#  c++  cache  caching  calendar  camera  canvas  cas  cdn  charting  charts  cheatsheet  chrome  chrome-dev-tools  chromium  claypool  clipboard  clojure  clojurescript  cloud  cloud9  cloudfront  cloudmade  cms  cocoa  code  coder  coffeescript  collaboration  color  compatibility  complexity  components  compression  concurrency  cookies  cordova  cors  cost  couchdb  coverflow  crdata.org  cryptography  csp  css  css3  cssgrid  csv  cuba  culture  curation  curl  d3  d3.js  dashboard  data  database  datagrid  datomic  datomicscript  debug  debugging  decentralized  deployment  design  desktop  development  devenv  devops  devtools  dgrid  diagram  distributed  django  dns  docker  docpad  documentation  dojo  dom  doppio  dragdrop  dropbox  dust.js  dynamic  easing  ebook  ec2  eclipse  ecm  ecmascript  ecommerce  editor  education  electron  elm  email  embedded  ember.js  encryption  enterprise  envjs  erlang  eslint  esp8266  events  express  expressions  facebook  federation  fft  filebrowser  filesystem  finance  firebase  firebug  firefox  flexbox  flight  fluid  flux  fonts  foreman  foundation  fp  fractal  framework  frontend  frontier  gallery  gamedev  gecko  gem  generator  gestures  ggplot2  ghost  gif  gis  gist  git  gitdown  github  golang  google  googleapps  graphics  graphql  grid  grunt  gtd  gui  gulp  hallo.js  handlebars  happs  harp  haskell  hci  headless  heroku  hhtp  history  hop  hosting  hotkeys  howto  html  html5  http  httpd  https  hugo  hyperlinks  ical  ide  identity  ideo  ie  ie7  ie9  iex  image  imageprocessing  images  imba  immutable  incrementalDOM  inferno  inlinecache  inncrementalDOM  inspector  instagram  instrumentation  interactive  intern  introduction  ios  ios6  iot  ipad  iphone  iphone5  java  java8  javascript  jaws  jekyll  jetbrains  jq  jqtouch  jquery  jsdom  jsil  jslint  jsmath  json  jsontree  jspp  kaman  keyboard  keypress  keyvalue  knockout.js  koa  kraken  kyt  lambda  latency  layout  leaflet  learning  less  library  likes  lint  linux  lively  livelykernel  llvm  LMS  localStorage  logging  login  logs  loopback  LTI  lua  lucene  manifest  mapbox  mapping  maps  mapserver  markdown  marketing  math  mathjax  mediaQueries  memcached  merb  messaging  metaballs  meteor  metrics  microservices  microsoft  middleman  mixpanel  ml  mobile  modern.ie  modules  mongrel  monitoring  moon  mozilla  msft  multimedia  museum  mvc  mylar  n1  nashorn  native  nativeclient  netflix  networking  newbrowse  news  newspaper  nginx  nitrogen  nodal  node  node.js  nodejs  noir  notebook  npm  nvu  nyt  objective-c  offline  om  online  opa  opengeo  opengl  opensource  optimization  orion  os  osgeo  osx  otoy  overview  owasp  p2p  p5  paas  pagination  panorama  parser  patterns  payments  pdf  performance  perfromance  phantom.js  phantomjs  phenomic  phonegap  phonosdk  photo  photography  php  piwik  plainjs  plan9  play  playground  plugin  podcast  polymer  postgreSQL  pow  presentation  print  privacy  process  processing  profiling  proglang  programming  ProjectManagement  prose.io  prototype  proxy  publishing  push  pushstate  pwa  python  qrcode  qt  query  r  rack  ractive  rails  rake  rank:1  raspberry_pi  raspi  react  react.js  reactive  ReactJS  realtime  rebelmouse  refactoring  refer  reference  relay  rendering  repl  research  resolution  resources  responsive  responsiveDesign  rest  rethinkdb  retina  reveal.js  rhino  ripple  rlang  roadmap  rook  routing  rss  rstats  RStudio  rsync  ruby  rubyfrontier  rubyonrails  rust  rxjs  s3  saas  safari  sandbox  sass  scala  scalability  scale  scanning  scatter  science  scraping  screencast  screenscraping  screenshot  screensize  scroll  scrolling  sculptgl  sculpture  search  security  selenium  semantic  seo  server  serverless  serviceworker  serviceworkers  servo  shiny  sinatra  sitemap  skrollr  slides  smalltalk  snippets  socialmedia  socket.io  socketstream  software  spa  speech  spreadsheet  sproutcore  sql  sqlite  ssl  sso  stack  stackvm  standard  standards  static  statistics  stencils  stocks  storage  strategy  streaming  stripe  sublime  svg  swift  synchronization  sysadmin  table  tablet  tagging  tags  telephony  template  templating  tensorflow  terminal  tessel  tessler  testing  tex  text  textile  textmate  texture  themes  three.js  threejs  tilemill  timeline  tips  tomcat  tooling  toolref  tools  touch  tracing  tracking  tree  trend  trends  tributary  tutorial  tweetdeck  twitter  types  typography  tyrone  udell  ui  unix  urlencoding  usability  ux  vc  vcdiff  video  videoediting  videos  viewpoint  vim  visual  visualisation  visualization  vivaldi  voice  vue.js  vulcan.js  w3c  wasm  web  webapps  webassembly  webaudio  webby  webcl  webcrypto  webdesign  webdev  webdriver  webgel  webgl  WebGL2  webian  webide  webkit  webmaster  webos  webpack  webrender  webrsync  webrtc  webserver  webservices  websockets  webvr  webworkers  weld  wiki  wildfly  wireframes  wordpress  workflow  writing  wsgi  wysiwyg  xhtml  xss  yeoman  yui  zappa  zeromq  zotonic  zurb  Zuul 

Copy this bookmark:



description:


tags: