Repository: netlify/million-devs Branch: master Commit: 8c90b2821473 Files: 56 Total size: 2.8 MB Directory structure: gitextract_lenc71pt/ ├── .gitignore ├── .nvmrc ├── README.md ├── babel.config.js ├── package.json ├── public/ │ ├── _redirects │ └── index.html └── src/ ├── App.vue ├── components/ │ ├── App2016.vue │ ├── App2017.vue │ ├── App2018.vue │ ├── App2019.vue │ ├── App2020.vue │ ├── AppAnalyticsuk.vue │ ├── AppAnimationSwitch.vue │ ├── AppAuditlogs.vue │ ├── AppBook.vue │ ├── AppBuildPlugins.vue │ ├── AppBush.vue │ ├── AppDeploybutton.vue │ ├── AppDeploypreview.vue │ ├── AppDocs.vue │ ├── AppDrop.vue │ ├── AppFunctions.vue │ ├── AppGithub.vue │ ├── AppGithubCorner.vue │ ├── AppGoldenGate.vue │ ├── AppHeader.vue │ ├── AppJamstack1.vue │ ├── AppJet.vue │ ├── AppLargemedia.vue │ ├── AppLetsencrypt.vue │ ├── AppLogin.vue │ ├── AppLoginResult.vue │ ├── AppLoginResultSticky.vue │ ├── AppMillion.vue │ ├── AppMobilepath.vue │ ├── AppNetlifycms.vue │ ├── AppRedirect.vue │ ├── AppScrolldown.vue │ ├── AppSeed.vue │ ├── AppSmashing.vue │ ├── AppSplittesting.vue │ ├── AppStatueDev.vue │ ├── AppStreetlamp1.vue │ ├── AppStreetlamp2.vue │ ├── AppText.vue │ ├── AppTree.vue │ ├── AppTweetit.vue │ ├── AppTwodoto.vue │ ├── AppVirtual.vue │ ├── AppYouarehere.vue │ ├── Footer.vue │ └── coords.js ├── main.js └── store/ └── index.js ================================================ FILE CONTENTS ================================================ ================================================ FILE: .gitignore ================================================ .DS_Store node_modules /dist # local env files .env.local .env.*.local # Log files npm-debug.log* yarn-debug.log* yarn-error.log* pnpm-debug.log* # Editor directories and files .idea .vscode *.suo *.ntvs* *.njsproj *.sln *.sw? ================================================ FILE: .nvmrc ================================================ 12.22.12 engine-strict=true ================================================ FILE: README.md ================================================ # Netlify Reaches a Million Developers! ![Screenshot of Site](https://assets.codepen.io/28963/CleanShot+2020-08-01+at+16.29.48%402x.png) Five years ago, Netlify launched and changed the way developers build for the web, and we've now onboarded more than 1 million users! Look up your Netlify account to learn when you joined, and check out the timeline to see animated versions of the big features and milestones along the way. Tweet your number and milestone to share with the community! ### [Check out the site here >](https://million-devs.netlify.com/?utm_source=csstricks&utm_medium=milliondevs-sd&utm_campaign=devex) There is also a writeup of how the application and SVG Animations were done, if you'd like to learn about the process, [the article is here](https://css-tricks.com/the-making-of-netlifys-million-devs-svg-animation-site/). ## Project setup ``` yarn install ``` ### Compiles and hot-reloads for development ``` yarn run serve ``` ### Compiles and minifies for production ``` yarn run build ``` ### Run your tests ``` yarn run test ``` ### Lints and fixes files ``` yarn run lint ``` ### Customize configuration See [Configuration Reference](https://cli.vuejs.org/config/). ================================================ FILE: babel.config.js ================================================ module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ] } ================================================ FILE: package.json ================================================ { "name": "million-devs", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build" }, "dependencies": { "core-js": "^3.6.5", "gsap": "^3.4.2", "vue": "^2.6.11", "vuex": "^3.4.0" }, "devDependencies": { "@vue/cli-plugin-babel": "^4.4.0", "@vue/cli-service": "^4.4.0", "node-sass": "^4.14.0", "sass-loader": "^8.0.2", "vue-template-compiler": "^2.6.11" }, "browserslist": [ "> 1%", "last 2 versions", "not dead" ] } ================================================ FILE: public/_redirects ================================================ /share/* http://million-devs-api.netlify.app/share/:splat 200! ================================================ FILE: public/index.html ================================================ Netlify Reaches One Million Devs!
================================================ FILE: src/App.vue ================================================ ================================================ FILE: src/components/App2016.vue ================================================ ================================================ FILE: src/components/App2017.vue ================================================ ================================================ FILE: src/components/App2018.vue ================================================ ================================================ FILE: src/components/App2019.vue ================================================ ================================================ FILE: src/components/App2020.vue ================================================ ================================================ FILE: src/components/AppAnalyticsuk.vue ================================================ ================================================ FILE: src/components/AppAnimationSwitch.vue ================================================ ================================================ FILE: src/components/AppAuditlogs.vue ================================================ ================================================ FILE: src/components/AppBook.vue ================================================ ================================================ FILE: src/components/AppBuildPlugins.vue ================================================ ================================================ FILE: src/components/AppBush.vue ================================================ ================================================ FILE: src/components/AppDeploybutton.vue ================================================ ================================================ FILE: src/components/AppDeploypreview.vue ================================================ ================================================ FILE: src/components/AppDocs.vue ================================================ ================================================ FILE: src/components/AppDrop.vue ================================================ ================================================ FILE: src/components/AppFunctions.vue ================================================ ================================================ FILE: src/components/AppGithub.vue ================================================ ================================================ FILE: src/components/AppGithubCorner.vue ================================================ ================================================ FILE: src/components/AppGoldenGate.vue ================================================ ================================================ FILE: src/components/AppHeader.vue ================================================ ================================================ FILE: src/components/AppJamstack1.vue ================================================ ================================================ FILE: src/components/AppJet.vue ================================================ ================================================ FILE: src/components/AppLargemedia.vue ================================================ ================================================ FILE: src/components/AppLetsencrypt.vue ================================================ ================================================ FILE: src/components/AppLogin.vue ================================================ ================================================ FILE: src/components/AppLoginResult.vue ================================================ ================================================ FILE: src/components/AppLoginResultSticky.vue ================================================ ================================================ FILE: src/components/AppMillion.vue ================================================ ================================================ FILE: src/components/AppMobilepath.vue ================================================ ================================================ FILE: src/components/AppNetlifycms.vue ================================================ ================================================ FILE: src/components/AppRedirect.vue ================================================ ================================================ FILE: src/components/AppScrolldown.vue ================================================ ================================================ FILE: src/components/AppSeed.vue ================================================ ================================================ FILE: src/components/AppSmashing.vue ================================================ ================================================ FILE: src/components/AppSplittesting.vue ================================================ ================================================ FILE: src/components/AppStatueDev.vue ================================================ ================================================ FILE: src/components/AppStreetlamp1.vue ================================================ ================================================ FILE: src/components/AppStreetlamp2.vue ================================================ ================================================ FILE: src/components/AppText.vue ================================================ ================================================ FILE: src/components/AppTree.vue ================================================ ================================================ FILE: src/components/AppTweetit.vue ================================================ ================================================ FILE: src/components/AppTwodoto.vue ================================================ ================================================ FILE: src/components/AppVirtual.vue ================================================ ================================================ FILE: src/components/AppYouarehere.vue ================================================ ================================================ FILE: src/components/Footer.vue ================================================ ================================================ FILE: src/components/coords.js ================================================ const coords = { computed: { svgCoords() { return { x: this.viewportSize == "large" ? this.x : this.xSmall, y: this.viewportSize == "large" ? this.y : this.ySmall, } }, }, } export default coords ================================================ FILE: src/main.js ================================================ import Vue from "vue" import App from "./App.vue" import store from "./store" Vue.config.productionTip = false new Vue({ store, render: (h) => h(App), }).$mount("#app") ================================================ FILE: src/store/index.js ================================================ import Vue from "vue" import Vuex from "vuex" Vue.use(Vuex) export default new Vuex.Store({ state: { toggleConfig: `play pause none pause`, startConfig: `center 90%`, isAnimationDisabled: false, viewportSize: "large", user: { name: "", number: "", }, }, mutations: { updateViewportState(state, size) { state.viewportSize = size }, updateAnimationState(state) { state.isAnimationDisabled = !state.isAnimationDisabled }, login(state, payload) { state.user.name = payload.name state.user.number = payload.number }, }, getters: { tweetPreviewLink: function(state, getters) { let twitterVideoSlugs = { jet: "1288850213172662272", redirect: "1288850337349197824", github: "1289369827228827648", letsencrypt: "1288850557013299203", seed: "1288852224467247106", deploypreview: "1289369944078143492", deploybutton: "1288852349335764997", twodoto: "1289370041616445440", splittesting: "1288852492248387586", auditlogs: "1288852552474406912", smashing: "1288852619251908608", netlifycms: "1289370121908047872", functions: "1288852683449933832", drop: "1288852749153718273", jamstack1: "1288852888312328192", largemedia: "1288852991529963525", "statue-dev": "1288853067518152705", analyticsuk: "1288853373496832003", book: "1288853167535464450", "golden-gate": "1288853434041589760", docs: "1288853499208503298", virtual: "1288853975710695424", "build-plugins": "1288854043134132227", million: "1288849874671341569", } if (twitterVideoSlugs[getters.milestone]) { return `https://twitter.com/1mdevs/status/${ twitterVideoSlugs[getters.milestone] }/video/1` } return "" }, milestone: function(state) { let ids = { jet: 0, // but really 7656 redirect: 12400, github: 18112, // out of order? letsencrypt: 25000, seed: 31226, deploypreview: 33769, deploybutton: 44319, twodoto: 74179, splittesting: 82983, auditlogs: 90554, smashing: 128546, netlifycms: 135652, functions: 183658, drop: 269271, jamstack1: 308307, largemedia: 395967, "statue-dev": 435285, analyticsuk: 520824, book: 542309, "golden-gate": 600000, docs: 625040, virtual: 750000, "build-plugins": 948344, million: 1000000, } let userNumber = parseInt( ("" + state.user.number).replace(/[^\d]*/g, ""), 10 ) let lastId = 0 for (let idStr in ids) { if (userNumber < ids[idStr]) { return lastId } lastId = idStr } return false }, milestoneCoords(state, getters) { let coords = { jet: { x: 1050, y: -350 }, redirect: { x: 450, y: 250 }, github: { x: 450, y: 250 }, letsencrypt: { x: 450, y: 250 }, seed: { x: 700, y: 850 }, deploypreview: { x: 420, y: 1200 }, deploybutton: { x: 350, y: 1700 }, twodoto: { x: 850, y: 1680 }, splittesting: { x: 1130, y: 2020 }, auditlogs: { x: 730, y: 2200 }, smashing: { x: 200, y: 2430 }, netlifycms: { x: 700, y: 2900 }, functions: { x: 250, y: 3250 }, drop: { x: 380, y: 3650 }, jamstack1: { x: 890, y: 3870 }, largemedia: { x: 100, y: 4200 }, "statue-dev": { x: 700, y: 4400 }, analyticsuk: { x: 800, y: 5050 }, book: { x: 1180, y: 4900 }, "golden-gate": { x: 200, y: 5300 }, docs: { x: 700, y: 5700 }, virtual: { x: 1400, y: 5950 }, "build-plugins": { x: 750, y: 6450 }, million: { x: 750, y: 6800 }, } if (coords[getters.milestone]) { return coords[getters.milestone] } return { x: -250, y: -1000 } }, }, actions: {}, modules: {}, })