zaydek-old

const MarkdownArray = [

  // `<Comment />`.
  { syntax: /^\/\/(.*)(?:$|\n)/,
  parser: (key, [children]) => <Comment key={key} children={parseText(children)} /> },

  // `<Header />`.
  { syntax: /^(#{1,6})( .*)(?:$|\n)/,
  parser: (key, [open, children]) => <Header key={key} open={open} children={parseText(children)} /> },

pngwn

The Simplest Svelte Static Site Generator

Assuming you don't want to statically export a Sapper app, most of the parts to build a simple SSG for Svelte already exist. The only thing that is missing is the tooling ('only').

However, you don't need a lot to get things going: just a couple of rollup builds and a config file will get you most of the way there. Just some glue.

What follows is a bunch of rambling, half thought out thoughts on how I would probably go about this. Most of the stuff discussed here is stuff I've actually done or half done or am in the process of doing with varying degrees of success. It is something I'll be spending more time on in the future. There are other things I have done, want to do, or think would be a good idea that are not listed here as they don't fall into the scope of a simple SSG.

*Dislaimer: This is how I would build an SSG, this isn't the only way, but I like this approach as there are a bunch of compile-time optimisations you can per

ryanflorence

Everything I Know About UI Routing

Definitions

1. Location - The location of the application. Usually just a URL, but the location can contain multiple pieces of information that can be used by an app
   1. pathname - The "file/directory" portion of the URL, like invoices/123
   2. search - The stuff after ? in a URL like /assignments?showGrades=1.
   3. query - A parsed version of search, usually an object but not a standard browser feature.
   4. hash - The # portion of the URL. This is not available to servers in request.url so its client only. By default it means which part of the page the user should be scrolled to, but developers use it for various things.
   5. state - Object associated with a location. Think of it like a hidden URL query. It's state you want to keep with a specific location, but you don't want it to be visible in the URL.

gaearon

If you use server rendering, keep in mind that neither useLayoutEffect nor useEffect can run until the JavaScript is downloaded.

You might see a warning if you try to useLayoutEffect on the server. Here's two common ways to fix it.

Option 1: Convert to useEffect

If this effect isn't important for first render (i.e. if the UI still looks valid before it runs), then useEffect instead.

function MyComponent() {

farskid

• http://krasimirtsonev.com/blog/article/managing-state-in-javascript-with-state-machines-stent
• http://www.inf.ed.ac.uk/teaching/courses/seoc/2005_2006/resources/statecharts.pdf
• https://medium.com/@asolove/pure-ui-control-ac8d1be97a8d
• https://rauchg.com/2015/pure-ui
• https://css-tricks.com/robust-react-user-interfaces-with-finite-state-machines/
• http://krasimirtsonev.com/blog/article/getting-from-redux-to-state-machine-with-stent
• https://www.smashingmagazine.com/2018/01/rise-state-machines/

timoxley

export function todoMachine ({ contextKey, task, ...opts }) {
  return {
    ...opts,
    initial: 'run',
    states: {
      run: {
        invoke: {
          src: (ctx, event) => (fn) => {
            const itemDone = (key) => (data) => {
              fn({ type: 'itemDone', data: { key, data } })

rikonor

package main

import (
	"fmt"
	"log"
	"net/http"
	"sync"
	"time"
)

benjtinsley

/*

Tailwind - The Utility-First CSS Framework

A project by Adam Wathan (@adamwathan), Jonathan Reinink (@reinink),
David Hemphill (@davidhemphill) and Steve Schoger (@steveschoger).


Welcome to the Tailwind config file. This is where you can customize
Tailwind specifically for your project. Don't be intimidated by the

Rich-Harris

I've been deceiving you all. I had you believe that Svelte was a UI framework — unlike React and Vue etc, because it shifts work out of the client and into the compiler, but a framework nonetheless.

But that's not exactly accurate. In my defense, I didn't realise it myself until very recently. But with Svelte 3 around the corner, it's time to come clean about what Svelte really is.

Svelte is a language.

Specifically, Svelte is an attempt to answer a question that many people have asked, and a few have answered: what would it look like if we had a language for describing reactive user interfaces?

A few projects that have answered this question:

ww9

GUI programs using Go and HTML/CSS/JS

Superior to similar solutions. Doesn't use electron or cgo. Easy communication between Go and Js. Can easily use libs like React, Vue and Angular.

This is a demo app using GUI library https://github.com/zserge/lorca which requires only Chrome and might even work with Firefox in the future.