diff --git a/netlify/functions/community/algolia.config.js b/netlify/functions/community/algolia.config.js deleted file mode 100644 index 7f17e4d3f..000000000 --- a/netlify/functions/community/algolia.config.js +++ /dev/null @@ -1,8 +0,0 @@ -require('dotenv').config(); - -module.exports = { - appId: 'VGOL4P01VV', - indexName: 'jamstack', - // It’s okay to have this in the repo, it’s used in the clientside JS - searchOnlyApiKey: "a457b566acbf454a61eaaae2e4fee0bf", -}; diff --git a/netlify/functions/community/eleventy-app-config-modules.js b/netlify/functions/community/eleventy-app-config-modules.js deleted file mode 100644 index f099476bc..000000000 --- a/netlify/functions/community/eleventy-app-config-modules.js +++ /dev/null @@ -1,5 +0,0 @@ -require("@11ty/eleventy"); -require("js-yaml"); -require("lodash"); -require("luxon"); -require("markdown-it"); \ No newline at end of file diff --git a/netlify/functions/community/eleventy-app-globaldata-modules.js b/netlify/functions/community/eleventy-app-globaldata-modules.js deleted file mode 100644 index 38687b79e..000000000 --- a/netlify/functions/community/eleventy-app-globaldata-modules.js +++ /dev/null @@ -1,5 +0,0 @@ -require("@11ty/eleventy-cache-assets"); -require("dotenv"); -require("fast-glob"); -require("gray-matter"); -require("node-fetch"); \ No newline at end of file diff --git a/netlify/functions/community/eleventy-bundler-modules.js b/netlify/functions/community/eleventy-bundler-modules.js deleted file mode 100644 index 2083a7141..000000000 --- a/netlify/functions/community/eleventy-bundler-modules.js +++ /dev/null @@ -1,2 +0,0 @@ -require("./eleventy-app-config-modules.js"); -require("./eleventy-app-globaldata-modules.js"); \ No newline at end of file diff --git a/netlify/functions/community/eleventy-serverless-map.json b/netlify/functions/community/eleventy-serverless-map.json deleted file mode 100644 index bca69a2d8..000000000 --- a/netlify/functions/community/eleventy-serverless-map.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "/community/": "./src/site/community.njk" -} \ No newline at end of file diff --git a/netlify/functions/community/eleventy-serverless.json b/netlify/functions/community/eleventy-serverless.json deleted file mode 100644 index 9c6a8bbc1..000000000 --- a/netlify/functions/community/eleventy-serverless.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "dir": { - "input": "src/site", - "data": "src/site/_data", - "includes": "src/site/_includes", - "output": "dist" - } -} \ No newline at end of file diff --git a/netlify/functions/community/eleventy.config.js b/netlify/functions/community/eleventy.config.js deleted file mode 100644 index b8266cc6e..000000000 --- a/netlify/functions/community/eleventy.config.js +++ /dev/null @@ -1,214 +0,0 @@ -const lodashGet = require("lodash/get"); -const yaml = require("js-yaml"); -const { EleventyServerlessBundlerPlugin } = require("@11ty/eleventy"); - -module.exports = function (eleventyConfig) { - // Support yaml data files - eleventyConfig.addDataExtension("yaml", contents => yaml.safeLoad(contents)) - - eleventyConfig.addWatchTarget("src/site/survey/**/*.js"); - - // ODB for Discord events - eleventyConfig.addPlugin(EleventyServerlessBundlerPlugin, { - name: "community", - functionsDir: './netlify/functions', - inputDir: "./src/site", - redirects: "netlify-toml-builders", - copy: ["algolia.config.js"] - }); - - - // pass images directly through to the output - eleventyConfig.addPassthroughCopy("src/site/img"); - eleventyConfig.addPassthroughCopy({ - "src/js": "js", - "node_modules/@zachleat/filter-container/*.js": "js", - "src/css": "css", - }); - - // Date helper - const { DateTime } = require('luxon'); - eleventyConfig.addFilter('formatDate', (dateObj, formatStr) => { - // convert any date strings to read dates - if (typeof (dateObj) == "string") { - dateObj = new Date(dateObj); - } - const format = formatStr ? formatStr : 'LLLL d, y'; - return DateTime.fromJSDate(dateObj, { - zone: 'utc' - }).toFormat(format); - }); - - // A handy markdown shortcode for blocks of markdown - // coming from our data sources - const markdownIt = require('markdown-it'); - const md = new markdownIt({ - html: true - }); - eleventyConfig.addPairedShortcode('markdown', (content) => { - return md.render(content); - }); - - - eleventyConfig.addFilter('convertFromEpoc', (time) => { - let date = new Date(0); - return date.setUTCSeconds(time); - }); - - - eleventyConfig.addCollection("resources", function (collectionApi) { - return collectionApi.getFilteredByGlob("src/site/resources/*.md"); - }); - - - // Filter a collection based on items flagged as "featured" - eleventyConfig.addFilter('featured', (items) => { - return items.filter(item => item.data.featured); - }); - - // Filter a collection based on the value of a data attribute - eleventyConfig.addFilter('dataAttr', (items, attr, value) => { - return items.filter(item => item.data[attr] == value); - }); - - // Filter a collection based on the value of a data attribute - eleventyConfig.addFilter('whereData', (items, expression) => { - let key = expression.split('=')[0]; - let val = expression.split('=')[1]; - return items.filter(item => item.data[key] == val); - }); - - - - - // filter a data array based on the value of a property - eleventyConfig.addFilter('select', (array, clause) => { - if (clause.indexOf("=") > -1) { - const property = clause.split("=")[0]; - const value = clause.split("=")[1]; - return array.filter(item => lodashGet(item, property).includes(value)); - } else { - return array.map(item => lodashGet(item, clause)); - } - }); - - eleventyConfig.addFilter('flatten', (array) => { - let results = []; - for (let result of array) { - if (result) { - if (Array.isArray(result)) { - results = [...results, ...result]; - } else { - results.push(result); - } - } - } - return results; - }); - - eleventyConfig.addFilter('unique', (array) => { - let caseInsensitive = {}; - for (let val of array) { - if (typeof val === "string") { - caseInsensitive[val.toLowerCase()] = val; - } - } - return Object.values(caseInsensitive); - }); - - // Get a random selection of items from an array - eleventyConfig.addFilter('luckydip', (array, count) => { - if (count > array.length) { - count = array.length; - } - const shuffled = array.sort(() => 0.5 - Math.random()); - return shuffled.slice(0, count); - }); - - // Convert an associative array into an indexable, iterable array - eleventyConfig.addFilter('iterable', (obj) => { - var iterableArray = new Array(); - for (var item in obj) { - iterableArray.push(obj[item]); - } - return iterableArray; - }); - - // format a url for display - eleventyConfig.addFilter('domain', (str) => { - var url = new URL(str); - return url.hostname; - }); - - - // convert json to yaml - eleventyConfig.addFilter('dumpasyaml', obj => { - return yaml.safeDump(obj) - }); - - // sort an array of objects by one object key value - // can also get fancy and do a lodash.get selector string too - // see https://lodash.com/docs/4.17.15#get - eleventyConfig.addFilter('sortKey', (arr, selector) => { - return arr.sort((a, b) => { - let aKey = lodashGet(a, selector).toLowerCase(); - let bKey = lodashGet(b, selector).toLowerCase(); - if (aKey < bKey) { - return -1; - } else if (aKey > bKey) { - return 1; - } - return 0; - }); - }); - - eleventyConfig.addFilter('sortTools', (arr, githubData) => { - return arr.sort((a, b) => { - let aKey = githubData[a.data.repo] ? (githubData[a.data.repo].stars || 0) : 0; - let bKey = githubData[b.data.repo] ? (githubData[b.data.repo].stars || 0) : 0; - if (aKey < bKey) { - return 1; - } else if (aKey > bKey) { - return -1; - } - return 0; - }); - }); - - - // Format a path to avoid any Cloudinary URL API miss-steps. - eleventyConfig.addFilter("cloudinaryifyPath", (str) => { - - if (str) { - - // add generic url encoding - str = encodeURI(str); - - // we also need to double escape some characters which might appear in text - // but are meaningful in cloudinary URLs - str = str.replace(/,/g, '%252C'); - str = str.replace(/\//g, '%252F'); - - } - return str; - }); - - - - // favicons files - eleventyConfig.addPassthroughCopy("src/site/browserconfig.xml"); - eleventyConfig.addPassthroughCopy("src/site/site.webmanifest"); - eleventyConfig.addPassthroughCopy("src/site/survey/2021/community-survey-2021-methodology.pdf"); - - return { - dir: { - input: "src/site", - inludes: "_includes", - output: "dist" - }, - passthroughFileCopy: true, - markdownTemplateEngine: false, - htmlTemplateEngine: "njk" - }; - -}; diff --git a/netlify/functions/community/src/site/_data/algolia.js b/netlify/functions/community/src/site/_data/algolia.js deleted file mode 100644 index 952da68df..000000000 --- a/netlify/functions/community/src/site/_data/algolia.js +++ /dev/null @@ -1,8 +0,0 @@ -const algoliaConfig = require("../../../algolia.config.js"); - -// don’t hardcode anything here, make the config variables opt-in -module.exports = { - appId: algoliaConfig.appId, - indexName: algoliaConfig.indexName, - searchOnlyApiKey: algoliaConfig.searchOnlyApiKey, -}; \ No newline at end of file diff --git a/netlify/functions/community/src/site/_data/announcementbar.json b/netlify/functions/community/src/site/_data/announcementbar.json deleted file mode 100644 index 769d72199..000000000 --- a/netlify/functions/community/src/site/_data/announcementbar.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "text": "Do you build websites and apps?", - "cta": "Take the Jamstack Community Survey 2022 today!", - "url": "https://netlify.qualtrics.com/jfe/form/SV_0BRbhN47gyZWYNo?Source=jamstack_eyebrow" -} \ No newline at end of file diff --git a/netlify/functions/community/src/site/_data/events.js b/netlify/functions/community/src/site/_data/events.js deleted file mode 100644 index c3f1a23bd..000000000 --- a/netlify/functions/community/src/site/_data/events.js +++ /dev/null @@ -1,17 +0,0 @@ -const fetch = require('node-fetch'); -require("dotenv").config(); - -module.exports = async function () { - const res = await fetch(`https://discord.com/api/v9/guilds/${process.env.DISCORD_GUILD_ID}/scheduled-events`, { - method: "GET", - headers: { - "Authorization": `Bot ${process.env.DISCORD_BOT_TOKEN}`, - } - }) - - const data = await res.json() - - console.log(data[0]) - - return data -} \ No newline at end of file diff --git a/netlify/functions/community/src/site/_data/fakeEvents.js b/netlify/functions/community/src/site/_data/fakeEvents.js deleted file mode 100644 index e20c9bd3f..000000000 --- a/netlify/functions/community/src/site/_data/fakeEvents.js +++ /dev/null @@ -1,53 +0,0 @@ -module.exports = [ - { - id: "984139361849344071", - name: "Testing Event 1", - image: "776157d997c8cf419ac3f72cbce52c01", - scheduled_start_time: '2022-08-11T15:00:00+00:00', - scheduled_end_time: '2022-08-11T21:00:00+00:00', - entity_metadata: { - location: "https://moarserverless.com" - }, - }, - { - id: "984139361849344072", - name: "Testing another event", - image: null, - scheduled_start_time: '2022-08-11T15:00:00+00:00', - scheduled_end_time: '2022-08-11T21:00:00+00:00', - entity_metadata: { - location: "https://moarserverless.com" - }, - }, - { - id: "984139361849344073", - name: "Testing an event with a slightly longer title than usual", - image: null, - scheduled_start_time: '2022-08-11T15:00:00+00:00', - scheduled_end_time: '2022-08-11T21:00:00+00:00', - entity_metadata: { - location: "https://moarserverless.com" - }, - }, - { - id: "984139361849344074", - name: "Testing event", - image: null, - scheduled_start_time: '2022-08-11T15:00:00+00:00', - scheduled_end_time: '2022-08-11T21:00:00+00:00', - entity_metadata: { - location: "https://moarserverless.com" - }, - }, - { - id: "984139361849344075", - name: "Event", - image: null, - scheduled_start_time: '2022-08-11T15:00:00+00:00', - scheduled_end_time: '2022-08-11T21:00:00+00:00', - entity_metadata: { - location: "https://moarserverless.com" - }, - } -] - diff --git a/netlify/functions/community/src/site/_data/github.js b/netlify/functions/community/src/site/_data/github.js deleted file mode 100644 index 9db2517cc..000000000 --- a/netlify/functions/community/src/site/_data/github.js +++ /dev/null @@ -1,132 +0,0 @@ -require('dotenv').config(); - -const CacheAsset = require("@11ty/eleventy-cache-assets"); -const fastglob = require("fast-glob"); -const graymatter = require("gray-matter"); - -/* -Sample return data: -{ - "data": { - "repository": { - "name": "repo-name", - "stargazers": { - "totalCount": 11 - }, - "forks": { - "totalCount": 3 - }, - "issues": { - "totalCount": 9 - } - } - } -} -*/ -async function githubRequest(user, repo) { - let errorData = { - stars: "", - forks: "", - issues: "", - }; - - if(process.env.ELEVENTY_ENV == 'dev' || !process.env.GITHUB_READ_TOKEN) { - return errorData; - } - - const query = ` - query { - repository(owner: "${user}", name: "${repo}") { - name - stargazers { - totalCount - } - forks { - totalCount - } - issues(states:[OPEN]) { - totalCount - } - } - } - `; - - const url = `https://api.github.com/graphql?user=${user}&repo=${repo}`; - const fetchOptions = { - method: "POST", - headers: { - "Authorization": `bearer ${process.env.GITHUB_READ_TOKEN}` - }, - body: JSON.stringify({ query }) - }; - const opts = { - duration: "1401m", // 23.5 hours - type: "json", - fetchOptions - }; - - let req; - try { - req = await CacheAsset(url, opts); - if(req.errors && req.errors.length) { - console.log( "GitHub Data Source Error from API", req.errors ); - if(req.errors.filter(e => e.type === "RATE_LIMITED").length > 0) { - throw new Error("Failing the build due to GitHub API rate limiting."); - } - return errorData; - } - - return { - stars: req.data.repository.stargazers.totalCount, - forks: req.data.repository.forks.totalCount, - issues: req.data.repository.issues.totalCount, - } - } catch(e) { - console.log( "GitHub Data Source Error", e ); - - return errorData; - } -} - -async function getReposFromMarkdown(glob) { - // Starters - let ssgs = await fastglob(glob, { - caseSensitiveMatch: false - }); - - let repos = []; - for(let ssg of ssgs) { - let matter = graymatter.read(ssg); - let fullRepo = matter.data.repo; - if(fullRepo) { - let split = fullRepo.split("/"); - let user = split[0]; - let repo = split[1]; - - if(!matter.data.repohost || matter.data.repohost === "github") { - if(matter.data.disabled) { - continue; - } - repos.push({ user, repo }); - } - } - } - - return repos; -} - -module.exports = async function() { - let data = {}; - - let ssgRepos = await getReposFromMarkdown("./src/site/generators/*.md"); - for(let entry of ssgRepos) { - data[`${entry.user}/${entry.repo}`] = await githubRequest(entry.user, entry.repo); - } - - let cmsRepos = await getReposFromMarkdown("./src/site/headless-cms/*.md"); - for(let entry of cmsRepos) { - data[`${entry.user}/${entry.repo}`] = await githubRequest(entry.user, entry.repo); - } - - return data; -}; \ No newline at end of file diff --git a/netlify/functions/community/src/site/_data/glossary.yaml b/netlify/functions/community/src/site/_data/glossary.yaml deleted file mode 100644 index 0873efeee..000000000 --- a/netlify/functions/community/src/site/_data/glossary.yaml +++ /dev/null @@ -1,127 +0,0 @@ - -# Summary and term values are used in both the page meta tags and also the auto generated -# open graph and twitter card images. Those 2 fields should not exceed the following character counts: -# term: 35 -# summary: 250 - -- term: 'Atomic deploys' - id: 'atomic' - summary: 'Contained and complete deploys, which begin being served only when all of their assets and config are complete and totally in place.' - definition: 'The word "atomic" is used to describe deploys which include no interim state or maintenance window. With atomic deploys, all of the code, assets and configuration of a site are updated at once so that a website cannot be served in a partially updated state. - - - While deploying and updating sites via FTP was once popular this would result in some updated files being present on the server and ready to serve while others were still in transit. Modern platforms avoid this situation by providing atomic deploys where the new version of the site only begins receiving request when all assets and configurations are available. See also [Immutable deploys](/glossary/immutable).' - -- term: 'Immutable deploys' - id: 'immutable' - summary: 'Once created, an immutable deploy of a website becomes an artifact which will not change. It is a known version of the site which can be redeployed with ease.' - definition: 'While a "mutable" item can change (be mutated) over time, an "immutable" item cannot. Once created, an immutable deploy of a website becomes an artifact which will not change. Instead, deploys result in new versions or instances of the site, and traffic is routed to them accordingly. - - - When paired with [atomic deploys](/glossary/atomic), immutable builds make it possible for sites to enjoy abilities such as instant rollbacks and versioning, and help to ensure that the code and assets of a website can be maintained in a known state.' - - -- term: 'CDN (Content Delivery Network)' - id: 'cdn' - summary: 'A network optimized for serving assets to users. A CDN can provide redundancy and also improve delivery performance as a result of being geographically distributed.' - definition: 'A distributed network optimized for serving assets to users. By being geographically distributed, a CDN can provide redundancy and also improve delivery performance as a result of servicing requests from the infrastructure closest to the user making the request.' - -- term: 'DPR (Distributed Persistent Rendering)' - id: 'dpr' - summary: 'An approach to sharing the work of rendering page views and persisting them as part of the latest deploy. Some pages are rendered as part of a build, others are rendered when first requested via their URL' - definition: 'An approach to sharing the work of rendering page views and persisting them as part of the latest deploy. Some pages are rendered as part of a build, others are rendered on demand when first requested via their URL. In this way, build times can be kept manageable for even very large sites as nominated pages can have their rendering deferred until first requested. - - - Since the pages rendered on demand become part of the latest deployment, key Jamstack principals and advantages such as [Immutable deploys](/glossary/immutable) and [atomic deploys](/glossary/atomic) are preserved. - - - This approach, [discussed in this RFC](https://github.com/jamstack/jamstack.org/discussions/549), can also populate pages with content not available at the time of the site build. Such as content contributed by users. - - - Read more details about [DPR in this post on the Netlify blog](https://www.netlify.com/blog/2021/04/14/distributed-persistent-rendering-a-new-jamstack-approach-for-faster-builds/?utm_source=jamstackorg&utm_medium=define-dpr&utm_campaign=devex-ph)' - - - -- term: 'Edge Network' - id: 'edge-network' - -- term: 'Serverless' - summary: 'Serverless functions are a means of providing a run-time environment for code without the need for knowledge of, or control over, the underlying environment.' - definition: '"Serverless" or "serverless functions" are a means of providing a run-time environment for code without the need for knowledge of, or control over, the underlying environment. [It allows event-driven logic on the server without setting up infrastructure](https://twitter.com/sarah_edo/status/1361692489384517634). - - - Common confusion over the term stems from the observation that "there is still a server somewhere", which is true, but no servers are present in the problem space of those working with serverless functions. In a similar way, a wireless router will have wires for power and connectivity, but no wires exist in the domain of the devices utilizing a wireless router to connect to the internet.' - id: 'serverless' - -- term: 'Pre-render / Pre-generate' - id: 'pre-render' - summary: 'To generate the markup which represents a view of in advance of when it is required instead of just-in-time in response to requests.' - definition: 'To generate the markup which represents a view in advance of when it is required. This happens during a build rather than on-demand so that web servers do not need to perform this activity for each request received.' - -- term: 'Server render' - id: 'server-render' - summary: 'To generate markup on the server rather than on the client. Server render usually refers to the process happening at request time, rather than in advance at build time.' - definition: 'To generate markup on the server rather than on the client. Server render usually refers to the process happening at request time, rather than at build time. Some do use this term as a catch all for any rendering taking place on a server, and so disambiguation is often sensible.' - -- term: 'Static site generator' - id: 'ssg' - summary: 'A tool which can transform content, data, and templates into files that can be deployed to a hosting environment as a ready-to-serve web site.' - definition: "A tool which can be run as part of a build to transform content, data, and templates into files which can be deployed to a hosting environment as a ready-to-serve web site. Find a more detailed description in this article: What is a Static Site Generator? And 3 ways to find the best one." - -- term: 'Headless technology' - id: 'headless-technology' - summary: 'Often referring to decoupled content management systems, headless tools have no responsibility for generating the view or presentation of content, but instead focus on the management of and access to content via APIs.' - definition: 'The term "headless" refers to removing the dependency of knowing where data will be displayed and instead just holding the data to be used wherever the developer chooses. This is often used to describe a CMS where content can be entered, held, then where and how that content is displayed is decided separately.' - -- term: 'Client render' - id: 'client-render' - summary: 'To generate the view of content, or update user interface elements, in the browser using JavaScript.' - definition: 'To generate the view of content in the browser using JavaScript. This often involves transmitting data to the browser rather than markup which is ready for the browser to display, and then using JavaScript to transform that data into a view by modifying the DOM' - -- term: 'Hydration' - id: 'hydration' - -- term: 'Decoupling' - id: 'decoupling' - summary: 'Creating a distinct separation between systems or services. By decoupling the services needed to operate a site, each component part can be more easily swapped out, upgraded, and understood.' - definition: 'Decoupling is the process of creating a clean separation between systems or services. By decoupling the services needed to operate a site, each component part can become easier to reason about, can be independently swapped out or upgraded, and can be designated the purview of dedicated specialists either within an organization, or as a third party.' - -- term: 'Dynamic server' - id: 'dynamic-server' - -- term: 'API' - id: 'api' - summary: 'API is the acronym for Application Programming Interface. It defines interactions that allows two applications to talk to each other.' - definition: 'API is the acronym for Application Programming Interface. It defines interactions that allows two applications to talk to each other.' - -- term: 'API Economy' - id: 'api-economy' - summary: 'A term that has come to mean the depth and breadth of APIs that are available for developers to use in the current landscape.' - definition: 'A term that has come to mean the depth and breadth of APIs that are available for developers to use in the current landscape.' - -- term: 'Microservice' - id: 'microservice' - summary: 'A programming paradigm where many parts of a large application are broken down into various units that have smaller responsibility.' - definition: 'A programming paradigm where many parts of a large application are broken down into various units that have smaller responsibility. We can use Serverless or APIs for this, but it''s not that APIs or Serverless are necessarily Microservices, it''s that we have split apart what we want to access, and that modularity is what we call Microservices.' - -- term: 'Jamstack' - id: 'jamstack' - summary: Jamstack is an architectural approach that decouples the web experience layer from data and business logic, improving flexibility, scalability, performance, and maintainability.' - definition: 'Jamstack is an architectural approach that [decouples](/glossary/decoupling) the web experience layer from data and business logic, improving flexibility, scalability, performance, and maintainability. Jamstack removes the need for business logic to dictate the web experience. - - - It enables a composable architecture for the web where custom logic and 3rd party services are consumed through [APIs](/glossary/api).' - -- term: 'Monolith' - id: 'monolith' - -- term: 'Monorepo' - id: 'monorepo' - -- term: 'Markup' - id: 'Markup' - -- term: 'Markdown' - id: 'Markdown' - - diff --git a/netlify/functions/community/src/site/_data/meetups.mocked.json b/netlify/functions/community/src/site/_data/meetups.mocked.json deleted file mode 100644 index 72c8574d6..000000000 --- a/netlify/functions/community/src/site/_data/meetups.mocked.json +++ /dev/null @@ -1,97 +0,0 @@ -[ - [ - { - "created": 1585342923000, - "duration": 7200000, - "id": "269697699", - "name": "Jamstack SF Meetup - April - VIRTUAL MEETUP!", - "date_in_series_pattern": false, - "status": "upcoming", - "time": 1587603600000, - "local_date": "2020-04-22", - "local_time": "18:00", - "updated": 1585343679000, - "utc_offset": -25200000, - "waitlist_count": 0, - "yes_rsvp_count": 39, - "venue": { - "id": 26043648, - "name": "Microsoft Reactor", - "lat": 37.78462219238281, - "lon": -122.39823150634766, - "repinned": true, - "address_1": "680 Folsom St #145", - "city": "San Francisco", - "country": "us", - "localized_country_name": "USA", - "zip": "94107", - "state": "CA" - }, - "is_online_event": false, - "group": { - "created": 1424300496000, - "name": "Jamstack San Francisco", - "id": 18444650, - "join_mode": "open", - "lat": 37.77000045776367, - "lon": -122.4000015258789, - "urlname": "jamstack-sf", - "who": "JAMsters", - "localized_location": "San Francisco, CA", - "state": "CA", - "country": "us", - "region": "en_US", - "timezone": "US/Pacific" - }, - "link": "https://www.meetup.com/jamstack-sf/events/269697699/", - "description": "
Hello! Welcome to the Jamstack SF meetup!
Sponsors: None at the moment! Ping me on meetup for inquiries.
Schedule:
6:00 PM - Introduction
6:15 PM - Bryan Robinson, \"The DIY Web: Where we came from; what we’ve lost; where we can go\"
7:00 PM - Lars Peterson, \"Blazing fast Jamstack personalization\"
7:45 PM - Chat on Slack Community
8:00 PM - Closing! Thank you!
Slack: https://join.slack.com/t/jamstack/shared_invite/zt-8nw6pmj5-sfla3J7jNBXhiL9ZDNdTtw
join #meetup-sfbayarea for community discussions live!
Talk #1: Bryan Robinson
The DIY Web: Where we came from; what we’ve lost; where we can go
Society’s perception of the web has changed. What was once a DIY paradise has neatly converted itself into a commercial juggernaut. The web’s commercial power keeps us all well-employed, but what have we lost since the days of the DIY movement?
In this talk, we’ll examine what has changed and how the Jamstack is positioning itself as a prime avenue to bring back personal projects, sites and apps in a big way.
Bryan has been creating hand-crafted experiences on the web his entire career. His experience spans from large content-driven news sites to boutique designs for small to medium businesses.
He’s currently making a living as a “free agent” developer evangelist for technologies he’s passionate about via his startup company Code Contemporary. In the past, he’s led agency design and development teams, been a front-end developer and a UX strategist.
Bryan hosts the That’s My Jamstack podcasts, streams live code and design daily and runs multiple developer groups in his hometown.
His passions on the web are CSS, layout and the Jamstack. He lives in Memphis with his wife, son and two cats.
**************************************************************
Talk #2: Lars Peterson
Blazing fast Jamstack personalization
It's a well-known fact that personalization can help increase engagement and conversions by giving site visitors a more relevant experience. In this session we dive into different types of personalization, ranging from easy to advanced, from rules-based to machine learning and how to use personalization on the Jamstack.
Lars Birkholm Petersen is co-founder of Uniform, a platform enabling Jamstack for the Enterprise and co-author of Connect: How to Use Data and Experience Marketing to Create Lifetime Customers. He is an expert on advising enterprise organizations on data architecture and architecting personalized experiences.
**************************************************************
", - "visibility": "public", - "member_pay_fee": false - } - ], - [ - { - "created": 1585905293000, - "duration": 5400000, - "id": "269831244", - "name": "Jamstack OPO #8 | Brunch is served - A Jamstack Story", - "date_in_series_pattern": false, - "status": "upcoming", - "time": 1587405600000, - "local_date": "2020-04-20", - "local_time": "19:00", - "updated": 1586179218000, - "utc_offset": 3600000, - "waitlist_count": 0, - "yes_rsvp_count": 18, - "venue": { - "id": 26906060, - "name": "Online event", - "repinned": false, - "country": "", - "localized_country_name": "" - }, - "is_online_event": true, - "group": { - "created": 1494438491000, - "name": "Jamstack Porto", - "id": 23707617, - "join_mode": "open", - "lat": 41.150001525878906, - "lon": -8.619999885559082, - "urlname": "Jamstack-Porto", - "who": "JAMsters", - "localized_location": "Porto, Portugal", - "state": "", - "country": "pt", - "region": "en_US", - "timezone": "Europe/Lisbon" - }, - "link": "https://www.meetup.com/Jamstack-Porto/events/269831244/", - "description": "Jamstack is not about specific technologies. It’s a new way of building websites and apps that delivers better performance, higher security, lower cost of scaling, and better developer experience.
For this event, Carlos Silva is going to share with us his experience with Jamstack and how it's possible to replace dynamic stacks such as WordPress by Jamstack.
Following governmental recommendations, this event will be held online. All participants that RSVP will have access to the link for the webinar.
## About the presentation
One of Carlos' favorite pastimes today is Jamstack and everything related to the latest development technologies. The term Jamstack was created by Mathias Biilman, co-founder of Netlify, to contrast with the more 'modern' approaches to web development like the LAMP stack, that some of us know very well. Jamstack refers to the serverless, database-free stack, composed only of Javascript, APIs and Markup. Interest in Jamstack is growing, and many feel that the Jamstack approach to web development, which in many ways is faster, more secure and offers greater stability than the traditional stack, is the future of the web. So let's see how we can \"abandon\" a backend stack like WordPress and replace it with Jamstack.
## About Carlos Silva
Husband to a beautiful wife and father to 2 awesome kids. Chief Technology Officer at BindTuning | Speaker | Developer Advocate felling in love with open source.
## Agenda:
- [19h00] Small introduction by Marzee Labs (https://marzeelabs.org/)
- [19h15] Brunch is served - A Jamstack Story by Carlos Silva
{{ item.link | domain}}
\ No newline at end of file diff --git a/netlify/functions/community/src/site/_includes/components/glossary-item.njk b/netlify/functions/community/src/site/_includes/components/glossary-item.njk deleted file mode 100644 index 6adcb98e2..000000000 --- a/netlify/functions/community/src/site/_includes/components/glossary-item.njk +++ /dev/null @@ -1,4 +0,0 @@ -- The conversation about Jamstack is happening right now. Join thousands of developers on Twitter, in global meetup groups and in the official Jamstack community slack. -
-{{ item.data.link | domain }}
-- {{ description | safe }} -
-{% endmacro %} - - - - -{% macro benefit(title, icon, description ) %} -{{ item.data.link | domain}}
diff --git a/netlify/functions/community/src/site/_includes/components/ticker.njk b/netlify/functions/community/src/site/_includes/components/ticker.njk deleted file mode 100644 index 5290334b1..000000000 --- a/netlify/functions/community/src/site/_includes/components/ticker.njk +++ /dev/null @@ -1,69 +0,0 @@ -{% macro main() %} -- {{ text }} -
- -{% endmacro %} diff --git a/netlify/functions/community/src/site/_includes/footer.njk b/netlify/functions/community/src/site/_includes/footer.njk deleted file mode 100644 index fa33354e0..000000000 --- a/netlify/functions/community/src/site/_includes/footer.njk +++ /dev/null @@ -1,11 +0,0 @@ -- Find more {% if page.url.includes("/generators/") %}static site generators{% else %}headless content management systems{% endif %}. -
-We’re always interested in what the websites you’re building are for. Are you putting together a personal site to show off your work? Making an e-commerce play? Or building an enterprise application? Our 2021 categories were a little different from the ones we used in 2020, so the results aren’t precisely comparable. But they’re still fascinating. Since people work on many sites over the course of a year, we allowed respondents to pick more than one option.
- -| Years of Experience | -Remote | -
|---|---|
| Personal blog/portfolio | 37% |
| B2B software | 35% |
| E-commerce | 34% |
| Consumer software | 33% |
| Informational | 33% |
| Lead capture/landing pages | 29% |
| Internal tools | 29% |
| Enterprise software | 25% |
| Documentation | 16% |
| Retail | 12% |
| News/Entertainment | 12% |
| Social media | 9% |
| Other | 7% |
| Games | 7% |
| Streaming media | 6% |
| Politics/activism | 5% |
Personal websites dominate, just like last year. Whatever else you build, you’re always building your own website too!
- -E-commerce is a huge driver, with a surprisingly strong showing by enterprise software at 25%.
- -We asked developers how many users the sites they build are intended to serve. Unsurprisingly, most devs work on websites for relatively small audiences. But one stat did energize us—32% of developers are working on sites that serve audiences of millions of users.
- -| Number of users | -Most sites | -Some sites | -
|---|---|---|
| Tens | 28% | 38% |
| Hundred | 31% | 45% |
| Thousands | 42% | 37% |
| 100 Thousands | 22% | 32% |
| Millions | 12% | 19% |
With 32% of developers saying they work on the very biggest websites, which have audiences in the millions of users, we wanted to see if this group differed substantially from the average developer.
- -| Frequency of large sites | -Content producer | -Back-end | -Front-end | -Full stack | -
|---|---|---|---|---|
| Never | 1.48% | 3.18% | 31.18% | 48.75% |
| Sometimes | 2.24% | 4.08% | 29.25% | 45.98% |
| Mostly | 2.58% | 4.37% | 34.92% | 39.88% |
The trend we’ve noticed here is specialization. In other words, the more likely you are to work on a big website as a developer, the more likely you are to be a specialist. Small teams don’t have dedicated content producers and are more likely to have full-stack developers. But those who work on big sites are more likely to specialize in back-end or front-end development.
- -We found another trend when we asked developers focused on large sites how important mobile devices are as a target. The more likely you are to work on large websites, the more likely you are to target mobile devices, and the more likely you are to consider them “very” important rather than just “somewhat” important.
- -| How frequently do you build sites for audiences of millions | -Somewhat | -Very | -
|---|---|---|
| Never | 68% | 25% |
| Sometimes | 76% | 21% |
| Mostly | 83% | 14% |
Every year, we ask developers what industry their company is in. Big companies often compete in more than one industry, so respondents can pick several industries.
- -Similar to last year, the top 10 companies reflect some obvious categories but also some surprises.
- -Advertising, marketing, media and publishing all seem like tech-forward industries you’d expect to find on the Jamstack. Education, finance, and healthcare, on the other hand, aren’t known for being early adopters.
- -| Industry | -Percentage | -
|---|---|
| Advertising & Marketing | 18.4% |
| Education | 15.9% |
| Finance & Financial Services | 12% |
| Media & Publishing | 11.8% |
| Business Support & Logistics | 10.2% |
| Healthcare & Pharmaceuticals | 9.5% |
| Entertainment & Leisure | 9.4% |
| Nonprofit | 8.7% |
| Telecommunications & Networking | 8.3% |
| Retail & Consumer Durables | 8.3% |
| N/A (Student/Unemployed/etc.) | 7.7% |
| Government | 6.9% |
| Food & Beverages | 5.8% |
| Real Estate | 5.3% |
| Manufacturing | 5% |
| Transportation & Delivery | 4.6% |
| Utilities Energy and Extraction | 4.5% |
| Construction Machinery and Homes | 4.4% |
| Insurance | 4.4% |
| Automotive | 4.1% |
| Consumer electronics | 3.7% |
| Agriculture | 3.3% |
| Airlines & Aerospace (including Defense) | 2.9% |
Jamstack isn’t all client-side, so we asked about the popularity of some major server-side technologies as well. We were particularly interested in how much adoption serverless functions are seeing compared to other server-side technologies.
- -Awareness was high for most techniques—over 75% in most cases—while usage was below half for each.
- -| Technique | -Percentage of respondents who use this | -Satisfaction score | -Most aware | -
|---|---|---|---|
| 1. Containers | -49% | -3.1 | -94% | -
| 2. Microservices | -44% | -4.9 | -89% | -
| 3. Orchestration | -27% | -2.4 | -89% | -
| 4. Functions as a service | -46% | -8.7 | -87% | -
| 5. Gateways | -42% | -6.4 | -80% | -
| 6. Event Hubs | -14% | -2.3 | -68% | -
Containers like Kubernetes are popular, and container orchestration is only used by half as many developers.
- -Functions as a service, like Netlify functions, are now almost as ubiquitous a technology as containers.
- -We’ll keep an eye on how functions usage has grown when we ask this question next year.
\ No newline at end of file diff --git a/netlify/functions/community/src/site/_includes/survey/choices.njk b/netlify/functions/community/src/site/_includes/survey/choices.njk deleted file mode 100644 index 9490c69ee..000000000 --- a/netlify/functions/community/src/site/_includes/survey/choices.njk +++ /dev/null @@ -1,983 +0,0 @@ -| CMS | -Usage | -Satisfaction | -Awareness | -
|---|---|---|---|
| 1. WordPress | -39.43% | -0.3 | -93.32% | -
| 2. Contentful | -22.13% | -2.2 | -70.13% | -
| 3. WordPress (Headless) | -21.57% | -1.1 | -86.67% | -
| 4. Strapi | -17.89% | -2.9 | -64.28% | -
| 5. Drupal | -13.36% | -0.4 | -83.95% | -
| 6. Sanity | -12.72% | -3.2 | -54.13% | -
| 7. Prismic | -12.31% | -2.0 | -53.79% | -
| 8. Wix | -11.4% | -0.5 | -86.47% | -
| 9. Ghost | -10.44% | -1.3 | -63.67% | -
| 10. Webflow | -10.38% | -1.1 | -62.92% | -
| 11. Squarespace | -10.22% | -0.5 | -74.67% | -
| 12. Forestry | -9.32% | -1.5 | -48.39% | -
| 13. Weebly | -5.77% | -0.6 | -61.35% | -
| 14. Contentstack | -5.45% | -1.0 | -35.28% | -
| 15. Agility CMS | -5.33% | -1.6 | -38.84% | -
| 16. Builder | -5.13% | -1.2 | -31.03% | -
Content management systems: Can’t live with them, can’t live without them. We asked developers to tell us a lot about CMSes: Whether they were aware of them, whether they used them, and whether they wanted to use them more or less.
- -We turned the ratio of “people who want to use it more” vs. “people who want to use it less” into something we call our “satisfaction score,” and you’ll see us use it a few times.
- -A score of less than one in “satisfaction” means more people want to stop using a technology than want to continue using it.
- -If you compare usage against satisfaction, you begin to see some clear takeaways:
- -| CMS | -Usage change (%) | -Satisfaction change | -Usage | -
|---|---|---|---|
| 1. WordPress | --10.08% | -0.2 | -39.43% | -
| 2. Contentful | -5.58% | -0.3 | -22.13% | -
| 3. WordPress (Headless) | -7.26% | -0.2 | -21.57% | -
| 4. Strapi | -102.15% | --1.2 | -17.89% | -
| 5. Drupal | --10.09% | -0.2 | -13.36% | -
| 6. Sanity | -48.08% | --3.5 | -12.72% | -
| 7. Prismic | -43.98% | --0.3 | -12.31% | -
| 8. Wix | -95.54% | -0.2 | -11.4% | -
| 9. Ghost | --2.06% | --0.3 | -10.44% | -
| 10. Webflow | -77.44% | -0.2 | -10.38% | -
| 11. Squarespace | --2.06% | -0.2 | -10.22% | -
| 12. Forestry | --3.82% | --0.5 | -9.32% | -
| 13. Weebly | -130.80% | -0.3 | -5.77% | -
We asked the same question last year about many of the same systems, allowing us this year to show a new visualization: How these things are changing over time.
- -JavaScript is unsurprisingly the primary language for the majority of developers at 55%. However, this is down since last year, from 63%.
- -Where are those points going? To TypeScript, mostly, which 15% of developers now report as their primary language, not just one they use. Python also went up, from 5% to 7%.
- -Separate from devs’ primary programming language, we asked about all languages. First, let’s look at their absolute usage and satisfaction:
- -| Language | -Usage | -Satisfaction | -Awareness | -
|---|---|---|---|
| 1. JavaScript | -96.48% | -4.2 | -99.76% | -
| 2. SQL | -67.1% | -1.6 | -98.18% | -
| 3. TypeScript | -60.37% | -7.6 | -97.85% | -
| 4. Shell (Bash) | -52.08% | -1.5 | -95.98% | -
| 5. PHP | -46.42% | -0.5 | -97.41% | -
| 6. Python | -42.41% | -2.8 | -98.03% | -
| 7. Java | -25% | -0.6 | -96.9% | -
| 8. C# | -21.5% | -1.4 | -97% | -
| 9. Ruby | -16.78% | -1 | -95.22% | -
| 10. C/C++ | -16.17% | -0.9 | -96.92% | -
| 11. Go | -15.23% | -3.4 | -94.37% | -
| 12. Swift | -9.42% | -2.9 | -92.06% | -
| 13. Rust | -8.91% | -4.0 | -91.89% | -
| 14. Visual Basic | -7.84% | -0.5 | -91.37% | -
| 15. Objective-C | -6.38% | -0.5 | -91.11% | -
| 16. Perl | -5.22% | -0.5 | -91.73% | -
| 17. Elixir | -4.83% | -2.4 | -77.97% | -
In absolute terms, JavaScript continues to dominate. Workhorse languages like SQL, Bash, and Python remain very heavily used, with TypeScript positioned as a newcomer to the big languages for web developers, with the happiest user base by some distance.
- -Smaller, newer languages like Rust, Go, Swift, and Elixir are in a cluster of small but happy user communities.
- -The cut-off line for satisfaction is 1.0, so below that line you see languages with unhappy users: PHP, Java, Perl, Objective-C, and all the C variants, except C#.
- -But now let’s look at annual changes:
- -| CMS | -Usage change (%) | -Satisfaction change | -Usage | -
|---|---|---|---|
| 1. JavaScript | --0.7% | --1.6 | -96.48% | -
| 2. SQL | -4.2% | -0.4 | -67.1% | -
| 3. TypeScript | -14.1% | -1.9 | -60.37% | -
| 4. Shell (Bash) | --2.7% | -0.1 | -52.08% | -
| 5. PHP | --0.2% | -0.2 | -46.42% | -
| 6. Python | -7.4% | -0.5 | -42.41% | -
| 7. Java | -2.2% | -0.3 | -25% | -
| 8. C# | -4.6% | -0 | -21.5% | -
| 9. Ruby | --1.4% | --0.1 | -16.78% | -
| 10. C/C++ | -6.3% | -0.2 | -16.17% | -
| 11. Go | -1.2% | -0.9 | -15.23% | -
| 12. Swift | -2.3% | --0.5 | -9.42% | -
| 13. Rust | -4.0% | --3.5 | -8.91% | -
| 14. Visual Basic | -3.6% | -0.3 | -7.84% | -
| 15. Objective-C | -1.4% | -0.2 | -6.38% | -
TypeScript has seen a huge leap in usage (bigger than the change in people who call it their primary language). Its usage increased from 46% to 60%. Even more surprisingly, it experienced a jump in satisfaction—usually as something gets more popular, satisfaction falls, since the user base has expanded beyond the super-satisfied early adopters.
- -In the top right, you can see languages that experienced an increase in usage and satisfaction. Python and Go are represented in this area, which is great news for them, as they are also big and popular.
- -The languages with unhappy users (shown in the previous graph) are also mostly in this top right quadrant: Visual Basic, Java, SQL, and the C variants. Their users aren’t happy, but they’re happier than last year.
- -In the top left are languages with increased satisfaction scores but decreased usage. You’d expect to see legacy languages with fans who are hanging on here, and so here we find PHP and Bash.
- -In the bottom right are languages that experienced more usage, but are less popular. As expected, up-and-coming languages, like Swift and Rust, are represented here. Go is not here, which is a surprise. It managed to make its users happier even as it grew.
- -Finally, the bottom left includes languages that lost both usage and popularity: Ruby is here, and so is JavaScript. Keep in mind that JavaScript is still far and away the most-used language, but its dominance is not so total as it was.
- -We asked about an enormous number of frameworks—over 30 of them. Visualizing so many frameworks at once is a challenge, so we split them into two groups: Major frameworks, where the cut-off is at least 10% usage, and then minor frameworks, where usage is less than 10% (keep in mind, developers use multiple frameworks and could mark all the frameworks they used, so these percentages add up to well over 100%).
-The major frameworks have a lot of surprises. React is the most frequent choice, as it has been for a long time, and its satisfaction score remains high. Vue has higher satisfaction but roughly half the usage.
-Next.js has stellar satisfaction and is really big these days, and Nuxt.js is a little smaller. If you were looking for a safe pick for a new kitchen-sink framework based on this data, Next or Nuxt are where to go.
-The big legacy frameworks, jQuery and Express, aren’t going anywhere. But with a satisfaction score below 1.0, jQuery users seem to wish it would.
-Relative newcomers Svelte and 11ty are doing very well, with 11ty continuing a strong showing despite relatively low awareness. Early-ish adopters, check these out.
-Both flavors of Angular have scores under 1.0, despite maintaining growth.
- -| Framework | -Percentage of respondents who use this | -Satisfaction score | -Awareness | -
|---|---|---|---|
| 1. React | -68.1% | -4.3 | -98.4% | -
| 2. Express | -51.3% | -1.9 | -91.5% | -
| 3. jQuery | -50.8% | -0.2 | -97.5% | -
| 4. Next.js | -43.2% | -7.0 | -93.9% | -
| 5. Vue | -39.4% | -5.2 | -94.8% | -
| 6. Gatsby | -36.9% | -1.9 | -91.7% | -
| 7. Nuxt.js | -24.8% | -5.5 | -84.6% | -
| 8. Angular 2+ | -19.9% | -0.8 | -95.3% | -
| 9. 11ty | -17.4% | -5.9 | -60.9% | -
| 10. Jekyll | -16.5% | -0.5 | -80.8% | -
| 11. Angular 1.x | -15.3% | -0.2 | -94.4% | -
| 12. Hugo | -14.8% | -1.3 | -73.6% | -
| 13. Svelte | -14.4% | -5.5 | -82% | -
| 14. Vite | -14.2% | -9.6 | -59.3% | -
| 15. Preact | -10.5% | -2.7 | -74.4% | -
Let’s look at the next group with under 10% usage. SvelteKit, with huge satisfaction and riding the coattails of Svelte over in the major frameworks group, looks likely to break out by next year.
- -Bad news for those under 1.0: Dojo, Hexo, Ember, Meteor and Backbone, with small and unhappy user bases, might be frameworks you consider moving away from.
- -| Framework | -Percentage of respondents who use this | -Satisfaction score | -Awareness | -
|---|---|---|---|
| 1. Nest | -8.8% | -2.6 | -59.9% | -
| 2. VuePress | -8.8% | -2.4 | -62.3% | -
| 3. Gridsome | -8.5% | -1.6 | -54.2% | -
| 4. SvelteKit | -8.1% | -6.0 | -58.1% | -
| 5. Backbone | -7.8% | -0.3 | -76.5% | -
| 6. Meteor | -6.5% | -0.5 | -69.5% | -
| 7. Docusaurus | -6.2% | -1.9 | -50.5% | -
| 8. Sapper | -6.1% | -1.2 | -45.1% | -
| 9. Hapi | -5.6% | -1.3 | -52.7% | -
| 10. Ember | -5.3% | -0.7 | -78.2% | -
| 11. Stencil | -4.3% | -1.8 | -43.8% | -
| 12. RedwoodJS | -4.3% | -1.8 | -48.9% | -
| 13. Clojure | -3.6% | -1.5 | -68.1% | -
| 14. Hexo | -3.4% | -0.8 | -43.2% | -
| 15. Blitz.js | -3.3% | -2.0 | -50.3% | -
| 16. Dojo | -2.9% | -0.9 | -51.5% | -
| 17. Remix | -2.4% | -1.4 | -43.0% | -
We didn’t ask about every framework this year last year as well, but we did for a lot of them, allowing us to show an annual changes chart.
- -| CMS | -Usage change (%) | -Satisfaction change | -Usage | -
|---|---|---|---|
| 1. React | -5.7% | -0.2 | -68.1% | -
| 2. Express | -5.3% | --0.4 | -51.3% | -
| 3. jQuery | --1.2% | -0.1 | -50.8% | -
| 4. Next.js | -22.2% | -0.9 | -43.2% | -
| 5. Vue | -1.9% | --0.6 | -39.4% | -
| 6. Gatsby | --2.9% | --2.5 | -36.9% | -
| 7. Nuxt.js | -5.2% | -- | 24.8% | -
| 8. Angular 2+ | -1.8% | -0.2 | -19.9% | -
| 9. 11ty | -7.0% | --7.2 | -17.4% | -
| 10. Jekyll | --2.4% | --0.1 | -16.5% | -
| 11. Angular 1.x | --0.7% | -0.1 | -15.3% | -
| 12. Hugo | -0.1% | --0.4 | -14.8% | -
| 13. Svelte | -3.4% | --1.4 | -14.4% | -
| 14. Preact | -2.9% | --4.0 | -10.5% | -
| 15. Nest | -4.5% | --5.3 | -8.8% | -
| 16. VuePress | -1.1% | --2.5 | -8.8% | -
Here you can see a clear trend mentioned several times. The more your usage grows, the more your satisfaction falls, as your user base expands beyond early adopters. As we saw, 11ty broke into major territory for the first time this year. It has a great satisfaction score, but it’s much lower than last year. This is true, to some degree, for all the growing frameworks. VuePress, Preact, Nest and 11ty form a straight line going down and to the right: the more users they gained, the less happy they were.
- -There are a few obvious exceptions. Next.js, despite growing enormously, also improved its satisfaction score.
- -React managed to keep its score steady. No small feat when you’re the biggest framework by a long shot.
- -Gatsby lost in both usage and satisfaction, an unfortunate outcome for that team.
- -Jamstack is all about APIs, and many third-party APIs exist to make life easier for developers.
- -The most popular third-party service is authentication, which is unsurprising—using an existing login reduces signup friction and the security challenges associated with maintaining your own authentication.
- -CMS services are likewise very popular. Why build a rich text editor when one already exists?
- -| API | -Most used | -
|---|---|
| User authentication | -55% | -
| Headless CMS | -53% | -
| Asset/Image management | -45% | -
| Headless database | -36% | -
| Headless e-commerce | -24% | -
The world is changing, and the Jamstack—and the developers who use it—is changing with it. Based on what you’ve told us this year, we’ve observed shifts within our developer community. What these changes tell us paints a picture of a world in which more people are coming to our community as new developers, often as students; some of the largest web sites and apps are built on the Jamstack; and more and more industries are represented in Jamstack development.
- -In other words, the Jamstack is touching all industries. We’ve gone mainstream as more developers learn about Jamstack. It’s the new way to build applications and websites, and it’s where the industry is going. Even more, it’s a thriving community that is growing fast as a wave of mainstream adoption continues, driven by fantastic scaling, high performance, and workflows and tooling that developers love.
- -Thank you for being part of the Jamstack community again this year. Join us and thousands of developers virtually at Jamstack Conf 2021 to learn how Jamstack started, where it’s going, and what’s next for our community.
- -Learn more:
- -#jamstack-community-survey channel in the Jamstack SlackBetween 2020 and 2021, we didn’t see much change in our mix of developer and non-developer respondents. That’s good news—it means we’re sampling the same population both years, and the changes we’re noticing in other parts of the survey are real changes, and not just statistical noise.
- -| People | -2020 | -2021 | -
|---|---|---|
| Developers | -79% | -81% | -
| Non-developers | -21% | -19% | -
This year, we asked respondents to specifically identify themselves as front-end, back-end, or full-stack developers. It’s not surprising that in a Jamstack survey, the vast majority of devs identified as front-end or full-stack.
- -Percentage of survey participants
-| Job Title | -Percentage of Survey Participants | -
|---|---|
| Developer: Front-end | -45% | -
| Developer: Full Stack | -32% | -
| Management | -6% | -
| Other | -5% | -
| Developer: Back-end | -5% | -
| Designer | -4% | -
| Content Producer | -2% | -
| DevOps | -2% | -
Here’s where we saw a huge change. When we asked about people’s employment status, we saw a big shift in 2021—the portion of our respondents who are students nearly doubled. We’ll discuss the reasons for this change later on in the report, but needless to say, the effects of the pandemic are one factor responsible for the increase in students.
- -| Employment Status | -2020 | -2021 | -
|---|---|---|
| Full-time | -69% | -60% | -
| Student | -9% | -16% | -
| Contractor | -11% | -10% | -
| Part-time | -4% | -5% | -
| Unemployed | -4% | -5% | -
| Between jobs | -4% | -3% | -
| Retired | -0% | -1% | -
We found more interesting data in job statistics in two other breakouts:
- -In both 2020 and 2021, we asked developers how many years of experience relevant to their job they have. We noticed a shift to lower levels of experience this year.
-Our category of newest developers, those with less than one year of experience, jumped from just 4% to 13% of respondents, and those with 1-2 years rose from 13% to 19%. All categories of those with more experience fell. Because we saw such a surge of students in our breakdown by job title, this makes sense—students have less experience, after all.
- -| Years of Experience | -2020 | -2021 | -
|---|---|---|
| < 1 | 4% | 13% |
| 1–2 | 13% | 19% |
| 3–4 | 20% | 18% |
| 5–6 | 15% | 12% |
| 7–8 | 9% | 7% |
| 9–10 | 12% | 8% |
| 11–12 | 5% | 5% |
| 13–14 | 5% | 3% |
| 15+ | 17% | 14% |
To confirm this, we looked further into this question in breakout 1: experience levels of students vs. non-student.
- -This year, we also asked developers where they were in the world, split into major geographical regions.
- -The data was unsurprising—mostly Europe and North America—until we split up the region data by the number of years of experience of the developers. We excluded students when doing the geographical breakout.
- -We noticed a clear trend: Newer developers are significantly more geographically diverse than more experienced developers. In the most experienced category, only 15% of developers don’t come from Europe or North America. But with the newest developers, that number more than triples to 48%. Our hope is that when people work from more diverse places, this fosters greater diversity of other kinds as well.
- -| Years of Experience | -Africa | -Asia Pacific | -Caribbean | -Central America | -Eastern Asia | -Europe | -Middle East | -North America | -South America | -Southern Asia | -
|---|---|---|---|---|---|---|---|---|---|---|
| < 1 | -5.32% | -17.02% | -0.53% | -2.13% | -2.13% | -27.66% | -0% | -23.94% | -8.51% | -12.77% | -
| 1–2 | -7.49% | -12.75% | -0.81% | -1.21% | -2.43% | -32.39% | -0.81% | -25.91% | -7.69% | -8.5% | -
| 3–4 | -5.09% | -9.86% | -1.11% | -1.11% | -1.75% | -38.16% | -1.43% | -28.78% | -5.88% | -6.84% | -
| 5–6 | -2.48% | -9.5% | -0.41% | -0.62% | -0.41% | -44.01% | -1.45% | -32.85% | -4.13% | -4.13% | -
| 7–8 | -1.28% | -8.97% | -0.64% | -0.00% | -1.28% | -42.31% | -0.96% | -34.62% | -7.05% | -2.88% | -
| 9–10 | -2.88% | -5.48% | -0.29% | -0.58% | -0.86% | -46.11% | -1.73% | -34.87% | -5.19% | -2.02% | -
| 11–12 | -1.35% | -9.01% | -0% | -1.8% | -0.45% | -43.24% | -0.45% | -37.84% | -4.95% | -0.9% | -
| 13–14 | -0.76% | -9.09% | -0% | -0.76% | -0% | -40.91% | -2.27% | -40.91% | -3.79% | -1.52% | -
| 15+ | -1.08% | -6.92% | -0.15% | -0.46% | -0.77% | -45.08% | -1.23% | -40.15% | -2.77% | -1.38% | -
To confirm that our changes to experience levels were caused by an uptick in students, we broke out students from full-timers and then looked at their experience levels.
-Sure enough: students were concentrated heavily into the first two years of experience.
- -| Years of Experience | -Full-time | -Students | -
|---|---|---|
| < 1 | 6% | 41% |
| 1–2 | 14% | 38% |
| 3–4 | 19% | 15% |
| 5–6 | 14% | 3% |
| 7–8 | 9% | 1% |
| 9–10 | 10% | 1% |
| 11–12 | 7% | 0% |
| 13–14 | 4% | 0% |
| 15+ | 16% | 1% |
This leads to the next question: Where did all these students come from? One potential explanation is that as Jamstack has continued to go mainstream, it’s become the default way of teaching new developers to launch their websites. In turn, that’s been increasing the percentage of students in the Jamstack community. We’ll dig more in future surveys to confirm this effect, but having a huge new population of new developers is a great sign for the community—the more, the merrier!
- -In 2020 and 2021, everyone’s life was affected by the COVID-19 pandemic in some way—for the purposes of our survey, we focused on how it changed developers’ working lives. What we found surprised us.
- -| Pandemic effect | -- |
|---|---|
| None of the above | 38% |
| Kept job—went fully remote | 31% |
| Kept job—went part-time remote | 14% |
| Lost a job | 9% |
| Took remote job that wouldn't have been feasible in-person | 9% |
| Moved to take advantage of remote work | 8% |
| Quit job to take care of family | 3% |
The biggest change we noticed was that 31% of developers said their job, previously not remote, went fully remote and will stay remote foreseeably—even after the pandemic ends. This represents a huge shift in working patterns for web developers. We also discovered interesting correlations to developers’ level of experience and their job title, which you can investigate in our breakout.
- -8% of developers said they moved to a new place to take advantage of remote work.
- -The other notable change we observed was 9% of developers said they lost a job. In section 1 we noted that the number of people reporting themselves as full-time employed had fallen, and the number of students had risen. It’s possible that some developers who lost their jobs moved into education.
- -As mentioned, a whopping 31% of developers said they went remote in the pandemic, and plan to stay remote after the pandemic. We wanted to know more about those people.
-First, we split up the respondents by experience. There was a notable effect here: The newest developers were much less likely to have “kept their job and gone remote” because they were more likely to have lost their job in the pandemic.
-Twelve percent of those with less than 1 year of experience reported losing a job to the pandemic, and 10% of those with less than 2 years did too.
-Excluding those with less than 2 years of experience, the percentage of developers who’d gone remote was even higher—40%! But that number didn’t change with further experience.
- -| Years of Experience | -Remote | -
|---|---|
| < 1 | 17% |
| 1–2 | 32% |
| 3–4 | 40% |
| 5–6 | 40% |
| 7–8 | 40% |
| 9–10 | 41% |
| 11–12 | 42% |
| 13–14 | 41% |
| 15+ | 39% |
Excluding those first two categories, we proceeded to look at job titles, and we noticed some substantial differences. Nearly 50% of DevOps respondents reported going full-time remote, while only 36% of managers said they did.
- -Front-end developers were more likely to go remote than full-stack developers, even though the data tells us that full-stack devs report having more experience on average than front-end ones.
- -We wanted to know why that happened. Initially, we thought it might be that the most experienced people were most likely to choose to work remotely. But, apart from full-stack and front-end not matching that pattern, the data indicated that management has even more experience, but is less likely to go remote.
- -Our conclusion is that we’re not sure what causes this. Could it be related to the number of meetings you have? Which jobs are harder to hire for? We will have to investigate further.
- -Percentage of workers by job title who went full-time remote, excluding those with less than 2 years’ experience
-| Years of Experience | -Remote | -
|---|---|
| DevOps | 50% |
| Back-end | 45% |
| Front-end | 43% |
| Full stack | 39% |
| Designer | 37% |
| Management | 36% |
| Content | 29% |
Industry thought leaders have been beating the “mobile-first” drum for years now, but is the industry actually listening? We asked how important it is for the sites devs build to work on four main categories of devices.
- -| Target | -Very | -Somewhat | -
|---|---|---|
| Desktop browsers | 84% | 14% |
| Phones | 71% | 24% |
| Tables | 41% | 50% |
| Watches / IoT | 7% | 18% |
Despite the talk of “mobile-first,” desktop remains Jamstack devs’ most-targeted category, although phones are close behind. The gap between the two has narrowed very slightly since 2020.
-Another interesting finding is how priorities shift. Desktops are very important for nearly everybody, but when it comes to tablets, more than half of developers who pay attention to them as a target think they’re only somewhat important.
-In our breakout on people who build large websites, we found an interesting correlation to the importance of mobile devices as a target.
- -All developers will agree that it’s important that your website is fast, secure, and has high uptime. But a different question to ask is: Which of these is the most important quality?
- -| Priority | -Score | -
|---|---|
| Performance | 4.54 |
| Uptime | 3.87 |
| Security | 3.61 |
| Dev Speed | 3.38 |
| Compliance | 3.08 |
| Avoid lock-in | 2.56 |
Last year, we noted that speed of development was a higher priority than security. This year, in a statistically significant shift, those factors were reversed. Jamstack developers are taking security more seriously than they did a year ago.
- -Performance and uptime continue to be the top priorities for developers.
- -A substantial population of designers responded to our survey, so in addition to asking about development tools, we also ask about design tools. The story in 2021 is the same as last year: Everybody uses Figma, and everybody loves it.
- -60% of respondents use Figma. Its satisfaction score is 8.8, meaning 8 times more people want to increase their usage than want to stop using it.
- -It’s getting kind of embarrassing for everyone clustered over there in the bottom left…
- -| Design tool | -Percentage of respondents who use this | -Satisfaction score | -Awareness | -
|---|---|---|---|
| 1. Figma | -62.3% | -8.8 | -90.49% | -
| 2. Framer | -10.82% | -2.2 | -52.67% | -
| 3. Adobe XD | -36.27% | -1.4 | -88.07% | -
| 4. Balsamiq | -14.46% | -1.0 | -58.27% | -
| 5. Sketch | -32.59% | -1.0 | -81.69% | -
| 6. Zeplin | -20.11% | -0.9 | -55.92% | -
| 7. InVision | -24.90% | -0.8 | -67.19% | -
This is the first year we’ve asked about the kinds of editors developers use. We were curious about the growth in popularity of web-based code editors, including products like Glitch and GitHub’s Codespace.
- -However, we mistakenly presented an ambiguous question. A “web-based editor” can also mean a CMS editor, like WordPress. And since CMSes are very popular, developers answering that question dominated the results: The more you use a CMS, the more likely you are to answer that you used a web-based editor.
- -But this in itself is a fun result! The popularity of CMSes means more people use web-based editors than traditional editors like Vim.
- -However, integrated development environments (IDEs) are by far the most popular option and have the highest levels of satisfaction by a long shot.
- -| Editor | -Percentage of respondents who use this | -Satisfaction score | -Awareness | -
|---|---|---|---|
| 1. IDEs | -95.89% | -15.6 | -99.3% | -
| 2. Web-based | -47.47% | -2.6 | -97.28% | -
| 3. Vim etc. | -42.32% | -1.4 | -96.98% | -
| 4. Plain text | -25.66% | -0.7 | -94.12% | -
Our community members gather in many channels, online and in-person around the world, to learn about modern web development techniques and emerging technologies. Join the community to exchange ideas, find new opportunities and help build a better web.
- -- To participate in our community channels, it’s important to read and follow our Code of Conduct -
-