{"id":16065189,"url":"https://github.com/se-gl/greencss-frontend","last_synced_at":"2026-05-17T03:45:58.824Z","repository":{"id":37435091,"uuid":"481622768","full_name":"Se-Gl/greenCSS-frontend","owner":"Se-Gl","description":"The new way to write CSS - for for everyone. Zero emission CSS design, for your creativity and your planet. ","archived":false,"fork":false,"pushed_at":"2022-11-11T12:41:31.000Z","size":26649,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-10T20:33:36.712Z","etag":null,"topics":["css","css-animations","css-framework","css-library","css3","mit-license","zero-emission"],"latest_commit_sha":null,"homepage":"https://www.greencss.dev","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Se-Gl.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/contributing.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-04-14T13:51:19.000Z","updated_at":"2022-06-21T17:09:41.000Z","dependencies_parsed_at":"2023-01-21T07:16:01.020Z","dependency_job_id":null,"html_url":"https://github.com/Se-Gl/greenCSS-frontend","commit_stats":null,"previous_names":[],"tags_count":47,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Se-Gl%2FgreenCSS-frontend","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Se-Gl%2FgreenCSS-frontend/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Se-Gl%2FgreenCSS-frontend/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Se-Gl%2FgreenCSS-frontend/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Se-Gl","download_url":"https://codeload.github.com/Se-Gl/greenCSS-frontend/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247318749,"owners_count":20919484,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","css-animations","css-framework","css-library","css3","mit-license","zero-emission"],"created_at":"2024-10-09T05:11:49.795Z","updated_at":"2025-10-28T02:31:33.065Z","avatar_url":"https://github.com/Se-Gl.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# greenCSS - write design with this zero emission\n\n[![Prettier and ESLint Code Base](https://github.com/Se-Gl/greenCSS-frontend/actions/workflows/lint.yml/badge.svg)](https://github.com/Se-Gl/greenCSS-frontend/actions/workflows/lint.yml)\n[![Cypress Base](https://github.com/Se-Gl/greenCSS-frontend/actions/workflows/cypress.yml/badge.svg)](https://github.com/Se-Gl/greenCSS-frontend/actions/workflows/cypress.yml)\n![check-code-coverage](https://img.shields.io/badge/code--coverage-82.89%25-green)\n\n⚠️ merged repo from [omenCSS](https://github.com/Se-Gl/omenCSS-frontend) - @ commit 435\n\n## Getting Started\n\nInstall the dependencies\n\n```bash\n# install all dependencies\nnpm i\n\n# ⚠️ If error, install husky and cypress manually\nnpm install husky --save-dev\nnpm install --save-dev cypress\n```\n\nRun the development server:\n\n```bash\n# start the localhost server and cypress\nnpm run e2e\n\n# backup\nnpm run dev\n```\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\n### cypress commands\n\n```bash\n# open cypress GUI\nnpm run cypress:open\n# run all cypress tests in the console\nnpm run cypress:run\n# manually get code coverage\nnpx nyc report --reporter=text-summary\nnpx update-badge\n```\n\n### esLint commands\n\n```bash\n# default nextjs eslint command\nnpm run lint\n# fix eslint errors by running prettier\nnpm run prettier\n```\n\n### env file\n\nCreate a `.env.local` file. Sendgrid will be used for the contact features.\n\n```env\nNODE_ENV=development\nPUBLIC_URL=http://localhost:3000\nNEXT_PUBLIC_BACKEND_API=http://localhost:8000/api\nNEXT_PUBLIC_API_URL=http://localhost:8000/api\nSENDGRID_API_KEY=YOUR-SENDGRID-API-KEY\nSENDGRID_MAILING_ID=YOUR-SENDGRID-CONTACT-LIST-ID\nSENDGRID_EMAIL=YOUR-SENDGRID-EMAIL\nNEXT_PUBLIC_GOOGLE_ANALYTICS=YOUR-GOOGLE-ANALYTICS-KEY\nNEXT_PUBLIC_STRIPE_KEY=YOUR-PUBLIC-STRIPE-KEY\nSTRIPE_SECRET_KEY=YOUR-SECRET-STRIPE-KEY\nNEXT_PUBLIC_MAPBOX_KEY=YOUR-MAPBOX-KEY\nPUBLIC_BACKEND_URL=http://localhost:8000 || YOUR URL POINTING TO YOUR BACKEND\n```\n\n- [sendgrid](https://signup.sendgrid.com/)\n- [STRIPE](https://dashboard.stripe.com)\n\n### Github actions\n\n- In order to follow best practices, simple github actions have been implemented.\n- greenCSS checks for EsLint errors (according to our .eslintrs.json rules) before pushing to the repo.\n- greenCSS checks the code for prettier violations (according to our .prettierrc file) before pushing to the repo.\n- greenCSS checks if the build process is completed successfully before pushing to the repo.\n- greenCSS tests the code with cypress before pushing to the repo.\n\n### Markdown Editor\n\nCreate new markdown posts and save it. All features, configuration and documentation are fetched from markdown files. A suitable editor can be found at:\n`http://localhost:3000/editor`\n\n### SCSS Structure - 7:1\n\nKeeping the architecture consistent and meaningful is even more of a challenge.\n\nA common and effective modular method for structuring Sass projects is the 7-1 pattern. This approach will be used in the development process of this project.\n\nA possible structure could look as follows _(as of July 2022)_\n\n```txt\nsass/\n|\n|– abstracts/\n|   |– _variables.scss    # Basic Project Variables\n|   |– _font.scss         # Font Related Files\n|   |– _color.scss        # Colour Mixins\n|   |– _index.scss        # Sass Index File\n|\n|– base/\n|   |– _reset.scss        # Reset/normalize\n|   |– _index.scss        # Sass Index File\n|\n|– components/\n|   |– _animation.scss    # Animations\n|   |– _buttons.scss      # Buttons\n|   |– _input.scss        # Input\n|   |– _markdown.scss     # Markdown\n|   |– _modal.scss        # Modal\n|   |– _nav.scss          # Nav\n|   |– _slider.scss       # Range Slider\n|   |– _toast.scss        # Toast\n|   |– _index.scss        # Sass Index File\n|\n|– layout/\n|   |– _index.scss        # Sass Index File\n|\n|– pages/\n|   |– _brand.scss        # Custom Brand Styles\n|   |– _landing.scss      # Custom Landing Page Styles\n|   |– _index.scss        # Custom Page Styles\n|\n|– themes/\n|   |– _index.scss        # Sass Index File\n|\n|– vendors/\n|   |– _leaflet.scss      # Leaflet addition\n|   |– _index.scss        # 3rd Party Solutions\n|\n – globals.scss              # Main Sass Input File\n```\n\n## Contribute\n\nCheck the [contributing file](/.github/contributing.md) for more details.\n\n1. Fork the repo and create your branch from `main`.\n2. If you've added code that should be tested, add tests.\n3. If you've changed APIs or added new dependencies, update the documentation.\n4. Ensure the test suite passes.\n5. Make sure your code lints.\n6. Use semantic versioning for commits.\n7. Issue a pull request!\n\n### Basic Frontend Libraries\n\n|                                                                                    | Stars                                                                                                             | Bundle size                                                                                                                                                      | Maintained | Dev- Mode |\n| ---------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- | --------- |\n| [next](https://www.npmjs.com/package/next)                                         | ![GitHub stars](https://img.shields.io/github/stars/vercel/next.js.svg?label=%F0%9F%8C%9F)                        | N/A                                                                                                                                                              | ✅         | ➖        |\n| [sass](https://www.npmjs.com/package/sass)                                         | ![GitHub stars](https://img.shields.io/github/stars/sass/dart-sass.svg?label=%F0%9F%8C%9F)                        | [![Bundle size](https://badgen.net/bundlephobia/minzip/sass/?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=sass)                                        | ✅         | ➖        |\n| [react-select](https://www.npmjs.com/package/react-select)                         | ![GitHub stars](https://img.shields.io/github/stars/JedWatson/react-select.svg?label=%F0%9F%8C%9F)                | [![Bundle size](https://badgen.net/bundlephobia/minzip/react-select/?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=react-select)                        | ✅         | ➖        |\n| [react-md-editor](https://www.npmjs.com/package/@uiw/react-md-editor)              | ![GitHub stars](https://img.shields.io/github/stars/uiwjs/react-md-editor.svg?label=%F0%9F%8C%9F)                 | [![Bundle size](https://badgen.net/bundlephobia/minzip/@uiw/react-md-editor/?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=@uiw/react-md-editor)        | ✅         | ➖        |\n| [next-remove-imports](https://www.npmjs.com/package/next-remove-imports)           | ![GitHub stars](https://img.shields.io/github/stars/uiwjs/next-remove-imports.svg?label=%F0%9F%8C%9F)             | [![Bundle size](https://badgen.net/bundlephobia/minzip/next-remove-imports/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/next-remove-imports)           | ✅         | ➖        |\n| [fast-average-color](https://www.npmjs.com/package/fast-average-color)             | ![GitHub stars](https://img.shields.io/github/stars/fast-average-color/fast-average-color.svg?label=%F0%9F%8C%9F) | [![Bundle size](https://badgen.net/bundlephobia/minzip/fast-average-color/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/fast-average-color)             | ➖         | ➖        |\n| [tinycolor2](https://www.npmjs.com/package/tinycolor2)                             | ![GitHub stars](https://img.shields.io/github/stars/bgrins/TinyColor.svg?label=%F0%9F%8C%9F)                      | [![Bundle size](https://badgen.net/bundlephobia/minzip/tinycolor2/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/tinycolor2)                             | ➖         | ➖        |\n| [gray-matter](https://www.npmjs.com/package/gray-matter)                           | ![GitHub stars](https://img.shields.io/github/stars/jonschlinkert/gray-matter.svg?label=%F0%9F%8C%9F)             | [![Bundle size](https://badgen.net/bundlephobia/minzip/gray-matter/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/gray-matter)                           | ➖         | ➖        |\n| [react-markdown](https://www.npmjs.com/package/react-markdown)                     | ![GitHub stars](https://img.shields.io/github/stars/remarkjs/react-markdown.svg?label=%F0%9F%8C%9F)               | [![Bundle size](https://badgen.net/bundlephobia/minzip/react-markdown/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/react-markdown)                     | ✅         | ➖        |\n| [react-syntax-highlighter](https://www.npmjs.com/package/react-syntax-highlighter) | ![GitHub stars](https://img.shields.io/github/stars/remarkjs/react-markdown.svg?label=%F0%9F%8C%9F)               | [![Bundle size](https://badgen.net/bundlephobia/minzip/react-syntax-highlighter/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/react-syntax-highlighter) | ✅         | ➖        |\n| [purgecss](https://www.npmjs.com/package/purgecss)                                 | ![GitHub stars](https://img.shields.io/github/stars/FullHuman/purgecss.svg?label=%F0%9F%8C%9F)                    | [![Bundle size](https://badgen.net/bundlephobia/minzip/purgecss?label=%F0%9F%92%BE)](https://bundlephobia.com/package/purgecss)                                  | ✅         | ✅        |\n| [@sendgrid/mail](https://www.npmjs.com/package/@sendgrid/mail)                     | ![GitHub stars](https://img.shields.io/github/stars/sendgrid/sendgrid-nodejs.svg?label=%F0%9F%8C%9F)              | [![Bundle size](https://badgen.net/bundlephobia/minzip/@sendgrid/mail?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=@sendgrid/mail)                     | ✅         | ✅        |\n| [remark-gfm](https://www.npmjs.com/package/remark-gfm)                             | ![GitHub stars](https://img.shields.io/github/stars/remarkjs/remark-gfm.svg?label=%F0%9F%8C%9F)                   | [![Bundle size](https://badgen.net/bundlephobia/minzip/remark-gfm?label=%F0%9F%92%BE)](https://bundlephobia.com/package/remark-gfm)                              | ✅         | ✅        |\n| [axios](https://www.npmjs.com/package/axios)                                       | ![GitHub stars](https://img.shields.io/github/stars/axios/axios.svg?label=%F0%9F%8C%9F)                           | [![Bundle size](https://badgen.net/bundlephobia/minzip/axios?label=%F0%9F%92%BE)](https://bundlephobia.com/package/axios)                                        | ✅         | ✅        |\n| [@stripe/stripe-js](https://www.npmjs.com/package/@stripe/stripe-js)               | ![GitHub stars](https://img.shields.io/github/stars/stripe/stripe-js.svg?label=%F0%9F%8C%9F)                      | [![Bundle size](https://badgen.net/bundlephobia/minzip/@stripe/stripe-js?label=%F0%9F%92%BE)](https://bundlephobia.com/package/@stripe/stripe-js)                | ✅         | ✅        |\n| [stripe](https://www.npmjs.com/package/stripe)                                     | ![GitHub stars](https://img.shields.io/github/stars/stripe/stripe-node.svg?label=%F0%9F%8C%9F)                    | [![Bundle size](https://badgen.net/bundlephobia/minzip/stripe?label=%F0%9F%92%BE)](https://bundlephobia.com/package/stripe)                                      | ✅         | ✅        |\n| [mapbox-gl](https://www.npmjs.com/package/mapbox-gl)                               | ![GitHub stars](https://img.shields.io/github/stars/mapbox/mapbox-gl-js.svg?label=%F0%9F%8C%9F)                   | [![Bundle size](https://badgen.net/bundlephobia/minzip/mapbox-gl?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=mapbox-gl)                               | ✅         | ✅        |\n| [react-map-gl](https://www.npmjs.com/package/react-map-gl)                         | ![GitHub stars](https://img.shields.io/github/stars/visgl/react-map-gl.svg?label=%F0%9F%8C%9F)                    | [![Bundle size](https://badgen.net/bundlephobia/minzip/react-map-gl?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=react-map-gl)                         | ✅         | ✅        |\n| [isbot](https://www.npmjs.com/package/isbot)                                       | ![GitHub stars](https://img.shields.io/github/stars/omrilotan/isbot.svg?label=%F0%9F%8C%9F)                       | [![Bundle size](https://badgen.net/bundlephobia/minzip/isbot?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=isbot)                                       | ✅         | ✅        |\n\n### Testing Libraries\n\n|                                                                                | Stars                                                                                                    | Bundle size                                                                                                                                                 | Maintained | Dev- Mode |\n| ------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- | --------- |\n| [cypress](https://www.npmjs.com/package/cypress)                               | ![GitHub stars](https://img.shields.io/github/stars/cypress-io/cypress.svg?label=%F0%9F%8C%9F)           | [![Bundle size](https://badgen.net/bundlephobia/minzip/cypress?label=%F0%9F%92%BE)](https://bundlephobia.com/package/cypress)                               | ✅         | ✅        |\n| [@cypress/code-coverage](https://www.npmjs.com/package/@cypress/code-coverage) | ![GitHub stars](https://img.shields.io/github/stars/cypress-io/code-coverage.svg?label=%F0%9F%8C%9F)     | [![Bundle size](https://badgen.net/bundlephobia/minzip/@cypress/code-coverage?label=%F0%9F%92%BE)](https://bundlephobia.com/package/@cypress/code-coverage) | ⚠️         | ✅        |\n| [check-code-coverage](https://www.npmjs.com/package/check-code-coverage)       | ![GitHub stars](https://img.shields.io/github/stars/bahmutov/check-code-coverage.svg?label=%F0%9F%8C%9F) | [![Bundle size](https://badgen.net/bundlephobia/minzip/check-code-coverage?label=%F0%9F%92%BE)](https://bundlephobia.com/package/check-code-coverage)       | ➖         | ✅        |\n\n### Automated Workflow Libraries\n\n|                                                                                                  | Stars                                                                                                         | Bundle size                                                                                                                                                                    | Maintained | Dev- Mode |\n| ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------- | --------- |\n| [prettier](https://www.npmjs.com/package/prettier)                                               | ![GitHub stars](https://img.shields.io/github/stars/prettier/prettier.svg?label=%F0%9F%8C%9F)                 | [![Bundle size](https://badgen.net/bundlephobia/minzip/prettier/?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=prettier)                                              | ✅         | ✅        |\n| [eslint](https://www.npmjs.com/package/eslint)                                                   | ![GitHub stars](https://img.shields.io/github/stars/eslint/eslint.svg?label=%F0%9F%8C%9F)                     | [![Bundle size](https://badgen.net/bundlephobia/minzip/eslint/?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=eslint)                                                  | ✅         | ✅        |\n| [eslint-config-prettier](https://www.npmjs.com/package/eslint-config-prettier)                   | ![GitHub stars](https://img.shields.io/github/stars/prettier/eslint-config-prettier.svg?label=%F0%9F%8C%9F)   | [![Bundle size](https://badgen.net/bundlephobia/minzip/eslint-config-prettier?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=eslint-config-prettier)                   | ✅         | ✅        |\n| [husky](https://www.npmjs.com/package/husky)                                                     | ![GitHub stars](https://img.shields.io/github/stars/typicode/husky.svg?label=%F0%9F%8C%9F)                    | [![Bundle size](https://badgen.net/bundlephobia/minzip/husky?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=husky)                                                     | ✅         | ✅        |\n| [lint-staged](https://www.npmjs.com/package/lint-staged)                                         | ![GitHub stars](https://img.shields.io/github/stars/okonet/lint-staged.svg?label=%F0%9F%8C%9F)                | [![Bundle size](https://badgen.net/bundlephobia/minzip/lint-staged?label=%F0%9F%92%BE)](https://bundlephobia.com/result?p=lint-staged)                                         | ✅         | ✅        |\n| [semantic-release](https://www.npmjs.com/package/semantic-release)                               | ![GitHub stars](https://img.shields.io/github/stars/semantic-release/semantic-release.svg?label=%F0%9F%8C%9F) | [![Bundle size](https://badgen.net/bundlephobia/minzip/semantic-release/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/semantic-release)                               | ✅         | ✅        |\n| [@commitlint/cli](https://www.npmjs.com/package/@commitlint/cli)                                 | ![GitHub stars](https://img.shields.io/github/stars/conventional-changelog/commitlint.svg?label=%F0%9F%8C%9F) | [![Bundle size](https://badgen.net/bundlephobia/minzip/@commitlint/cli/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/@commitlint/cli)                                 | ✅         | ✅        |\n| [@commitlint/config-conventional](https://www.npmjs.com/package/@commitlint/config-conventional) | ![GitHub stars](https://img.shields.io/github/stars/conventional-changelog/commitlint.svg?label=%F0%9F%8C%9F) | [![Bundle size](https://badgen.net/bundlephobia/minzip/@commitlint/config-conventional/?label=%F0%9F%92%BE)](https://bundlephobia.com/package/@commitlint/config-conventional) | ✅         | ✅        |\n\n### Sources\n\n| Illustrations |                                                                                    |\n| ------------- | ---------------------------------------------------------------------------------- |\n| title         | Leaf Illustration                                                                  |\n| source        | [Figma](https://www.figma.com/community/file/943843409604246251/Leaf-Illustration) |\n| author        | [seda](https://www.figma.com/@seda)                                                |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | Changes were made to the fill- colours, line \u0026 shadow adjustments.                 |\n| ----------    | ------------------------------------                                               |\n| title         | MacBook-Pro-2021-Free-Figma-Mockups-BRIX-Templates-Community                       |\n| source        | [Figma](https://www.figma.com/community/file/1085600632685733875)                  |\n| author        | [BRIX Templates](https://www.figma.com/@brixtemplates)                             |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | N/A                                                                                |\n| ----------    | ------------------------------------                                               |\n| title         | Financial Tech Landing Page                                                        |\n| source        | [Figma](https://www.figma.com/community/file/1110497789171535089)                  |\n| author        | [Ilham Meidi](https://www.figma.com/@ilhammeidi)                                   |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | Used light background for desktop inspiration                                      |\n| ----------    | ------------------------------------                                               |\n| title         | Miniverse 3D illustrations                                                         |\n| source        | [Figma](https://www.figma.com/community/file/1086469618136183011)                  |\n| author        | [Dddkit](https://www.figma.com/@dddkit)                                            |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | -                                                                                  |\n| ----------    | ------------------------------------                                               |\n| title         | People 3D Avatar                                                                   |\n| source        | [Figma](https://www.figma.com/community/file/1123564098205454830)                  |\n| author        | [Spectrum UI](https://www.figma.com/@SpectrumUI)                                   |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | -                                                                                  |\n| ----------    | ------------------------------------                                               |\n| title         | Wolf 3D Character                                                                  |\n| source        | [Figma](https://www.figma.com/community/file/1087594340256737579)                  |\n| author        | [BLRDY](https://www.figma.com/@blrdystudio)                                        |\n| license       | [CC-BY-4.0](http://creativecommons.org/licenses/by/4.0/)                           |\n| changes       | -                                                                                  |\n\n### Ideas \u0026 Inspiration\n\n- [Toast](https://www.youtube.com/watch?v=OXP-a9pyNRk)\n- [ToC](https://github.com/K-Sato1995/react-toc)\n- [Newsletter](https://dev.to/michael_webdev/create-a-mailing-list-with-sendgrid-and-next-js-41f7)\n- [Captcha](https://github.com/nabidam/react-captcha)\n- [Google Analytics](https://medium.com/@mikegajdos81/how-to-add-googleanalytics-4-to-nextjs-app-in-4-simple-steps-3c6f9de2f866)\n- [Stripe](https://betterprogramming.pub/create-your-portfolio-using-next-js-tailwind-css-stripe-and-paypal-80c723bb3fef)\n- [Map Tile](https://wiki.openstreetmap.org/wiki/Tile_servers)\n- [ImageRenderer](https://amirardalan.com/blog/use-next-image-with-react-markdown)\n- [Navigation](https://github.com/gurhanalan/React-StripeNavbar-Component)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fse-gl%2Fgreencss-frontend","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fse-gl%2Fgreencss-frontend","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fse-gl%2Fgreencss-frontend/lists"}