Code Monkey home page Code Monkey logo

nebulix's Introduction

Nebulix | Astro + Static CMS

License: CC BY-ND 4.0

A Universe of Possibilities: Blogs, Portfolios, Webshop, Restaurant Menus, and Beyond.

Nebulix

Notice

This theme is currently under development, and until we reach version 1.0.0, there is a possibility that upgrading could lead to errors.

πŸ› οΈDeploy

Easily deploy this theme to Netlify with a single click, and conveniently update environment variables afterward on Netlify.

Deploy to Netlify

Constellations of Features:

  • πŸ“° Chart Your Path with a Blog
  • πŸ–Ό Showcase Your Stellar Portfolio
  • 🍝 Illuminate Culinary Voyages with a Restaurant Menu
  • πŸ›’ Launch Your Webshop Powered by Snipcart
  • πŸ” SEO Constellations: Canonical URLs and OpenGraph radiance
  • 🧭 Navigational Maps: Sitemap Support
  • πŸ“‘Language of the Stars: Markdown & MDX Support
  • πŸ“ Static CMS Ready for Galactic Exploration
  • 🐡 Mailchimp newsletter form
  • πŸ•΅ Unveil Hidden Constellations with Full Text Search using Pagefind

♻️ Page Speed and Emissions

Experience the green and swift capabilities of Nebulix. With an impressively low emission of 0.05g - 0.07g CO2 per page visit and consistently achieving a lighthouse score between 98 and 100, Nebulix ensures both speed and environmental consciousness for your website.

πŸš€ Getting Started

1. Setting up the .env file

rename the env.txt to .env and fill in your details

BLOG_SLUG=blog
PORTFOLIO_SLUG=work
SHOP_SLUG=shop
MENU_SLUG=menu
WEBSITE_LANGUAGE=en
CURRENCY=USD
UNITS=metric
SNIPCART_KEY=<your-snipcart-public-key>
NODE_VERSION=18
NEWSLETTER_PROVIDER=mailchimp
MAILCHIMP_API_KEY=XXXXXXXXXXXXXXXX-us21
MAILCHIMP_SERVER_PREFIX=us21	
MAILCHIMP_LIST_ID=XXXXXXXXX

FROM_EMAIL_ADDRESS=[[email protected]](mailto:[email protected])
TO_EMAIL_ADDRESS=[[email protected]](mailto:[email protected])

MAILGUN_API_KEY=XXXXXXXXX
MAILGUN_DOMAIN=XXXXXXXXX
MAILGUN_API_URL=<https://api.eu.mailgun.net>

POSTMARK_SERVER_TOKEN=XXXXXXXXX

SLACK_CHANNEL_ID=XXXXXXXXX
SLACK_TOKEN=XXXXXXXXX

2. Configure your Static CMS Backend

Navigate to src/pages/admin.astro and provide your Git repository details. You can find a list of all supported Git backends at: https://www.staticcms.org/docs/backends-overview

Gitlab Example:

const config = {
	locale: lang,
	site_url: url,
	logo_url: 'https://nebulix.unfolding.io/nebulix-logo.svg',
	local_backend: true,
	backend: {
		name: 'gitlab',
		repo: '/<your-gitlab-repo>',
		auth_type: 'pkce', // Required for pkce
		app_id: 'xxxx', // Application ID from your GitLab settings
		commit_messages: {
			create: 'Create {{collection}} "{{slug}}"',
			update: 'Update {{collection}} "{{slug}}"',
			delete: 'Delete {{collection}} "{{slug}}"',
			uploadMedia: 'Upload "{{path}}"',
			deleteMedia: 'Delete "{{path}}"'
		}
	},
	search: 'true',
    ....
}

3. Add your site to the astro config

export default defineConfig({
	site: 'https://your-website.com',
    ....

4. Install dependencies

$ npm install

πŸ› οΈ 5. Start Development server

$ npm run dev

If you wish to engage the local backend:

$ npm run cms-proxy-server

Now you can open Static CMS on http://localhost:4321/admin/

❌ Removing Collections

If your cosmic journey excludes a blog, portfolio, shop, or restaurant menu, simply remove the corresponding documents from the src/content. Additionally, erase the page templates from src/pages .

πŸ›Έ Commands

All commands are run from the root of the project, from a terminal:

Command Action
npm install Installs dependencies
npm run dev Starts local dev server at localhost:4321
npm run cms-proxy-server Starts Static CMS proxy server for local-backend
npm run build Build your production site to ./dist/
npm run preview Preview your build locally, before deploying
npm run astro ... Run CLI commands like astro add, astro check
npm run astro -- --help Get help using the Astro CLI

πŸ“ Documentation

Learn how to harness the power of Static CMS and craft a distinctive website that stands out from the crowd.

Documentation

🌐 Demo

Witness the extraordinary speed of Nebulix in action.

Demo

πŸ‘€ Want to learn more about Astro?

Check out Astro documentation or jump into Astro's Discord server.

πŸ“š Tech Stack

Astro, MDX, Vue, TailwindCSS, Pagefind, Snipcart

πŸ›Ÿ Support

If you encounter any issues or bugs, we encourage you to open an issue in the repository. To help us quickly address the problem, please provide detailed information about the bug and steps to reproduce it.

πŸ‘‘ Premium Support

For those seeking priority assistance, we offer premium support services. Do you need support, custom intergrations, design, or development? Feel free to reach out to me by email at [email protected]. find me on UpWork Im here to help!

πŸ“ License

Want to get rid of the attribution? Simply purchase a license and you're good to go.

πŸš• Roadmap

As we journey towards v1.0, our path includes enriching the page builder with a diverse array of new blocks, upgrading dependencies to ensure optimal performance, and introducing exciting features. We're eager to hear from you! If you have any feature requests, please feel free to reach out and let us know.

β˜•οΈ Want to Caffeinate your Developer?

By caffeinating your developer, you're not just getting the best out of them; you're also ensuring a cheerful and energetic work environment.😊

buymeacoffee

πŸ“Έ Screenshots

Nebulix

Nebulix

Nebulix

Nebulix

Nebulix

Nebulix

Nebulix

Nebulix

nebulix's People

Contributors

preetamslot avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

nebulix's Issues

Unable to deploy to Netlify

Getting the following error when building and deploying through Netlify:

β”œβ”€ /images/about-us/index.htmlmunmap_chunk(): invalid pointer
9:38:39 PM: Aborted (core dumped)
9:38:39 PM: ​
9:38:39 PM: "build.command" failed                                        
9:38:39 PM: ────────────────────────────────────────────────────────────────
9:38:39 PM: ​
9:38:39 PM:   Error message
9:38:39 PM:   Command failed with exit code 134: npm run build
9:38:39 PM: ​
9:38:39 PM:   Error location
9:38:39 PM:   In Build command from Netlify app:
9:38:39 PM:   npm run build
9:38:39 PM: ​
9:38:39 PM:   Resolved config
9:38:39 PM:   build:
9:38:39 PM:     command: npm run build
9:38:39 PM:     commandOrigin: ui
9:38:39 PM:     edge_functions: /opt/build/repo/edge-functions
9:38:39 PM:     environment:
9:38:39 PM:       - BLOG_SLUG
9:38:39 PM:       - CURRENCY
9:38:39 PM:       - MENU_SLUG
9:38:39 PM:       - NODE_VERSION
9:38:39 PM:       - PORTFOLIO_SLUG
9:38:39 PM:       - SHOP_SLUG
9:38:39 PM:       - UNITS
9:38:39 PM:       - WEBSITE_LANGUAGE
9:38:39 PM:     publish: /opt/build/repo/dist
9:38:39 PM:     publishOrigin: config
9:38:39 PM:   plugins:
9:38:39 PM:     - inputs: {}
9:38:39 PM:       origin: ui
9:38:39 PM:       package: "@netlify/plugin-lighthouse"
9:38:40 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
9:38:40 PM: Failing build: Failed to build site
9:38:40 PM: Finished processing build request in 51.116s
9:38:40 PM: Failed during stage "building site": Build script returned non-zero exit code: 2

Have tried a brand new build using the button and getting the same issue.

Typo on Home Page

Line 63 of /src/content/page/index.mdx - Multiple has a typo

Do I have permissions to create a branch and open PR?

Something went wrong installing the "sharp" module

I am using a Macbook Pro with a M2 chip, and I am getting this issue when running npm run dev

/Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/sharp.js:37
  throw new Error(help.join('\n'));
        ^

Error: 
Something went wrong installing the "sharp" module

Cannot find module '../build/Release/sharp-darwin-arm64v8.node'
Require stack:
- /Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/sharp.js
- /Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/constructor.js
- /Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/index.js

Possible solutions:
- Install with verbose logging and look for errors: "npm install --ignore-scripts=false --foreground-scripts --verbose sharp"
- Install for the current darwin-arm64v8 runtime: "npm install --platform=darwin --arch=arm64v8 sharp"
- Consult the installation documentation: https://sharp.pixelplumbing.com/install
    at Object.<anonymous> (/Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/sharp.js:37:9)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:119:18)
    at Object.<anonymous> (/Users/lekiq/opensource/nebulix/node_modules/astro-compress/node_modules/sharp/lib/constructor.js:11:1)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)

Node.js v18.18.2

Console.log error

The theme displays an error in the console's inspect window, as shown below:
image
While this is not a major issue, the theme no longer scores a hundred on PageSpeed Insights under 'Best Practices.'

image

Page Load Issue On Chrome

On chrome below error occurs while navigating to pages. After reloading page load successfully. This issue is occurring on both local and live build.

Aw, Snap!
Something went wrong while displaying this webpage.
Error code: 11

New Page Not Shown

I created a new page via the admin CMS. I can only access it via URL, example. site.com/a-new-page. I expect a new page to be shown in the header menu.

document is not defined error

I'm afraid my developer skills end after Google fails me.

I get an error,

Browser APIs are not available on the server.

If the code is in a framework component, try to access these objects after rendering using lifecycle methods or use a client:only directive to make the component exclusively run on the client.

See  https://docs.astro.build/en/guides/troubleshooting/#document-or-window-is-not-defined  for more information.

ReferenceError: document is not defined
    at /home/parallels/Documents/nebulix/src/util/toLocale.ts:4:12
    at instantiateModule (file:///home/parallels/Documents/nebulix/node_modules/vite/dist/node/chunks/dep-df561101.js:55974:15)

I have tried this on a Mac, and a Windows VM, A fedora VM and all get the same error.

Loving the look and fit and finish. I would love it more if it worked for me haha

Paul

Github Login is not shown for Deployed Site's Admin Page

Locally, the admin page says "Login with Github", and then I created a page and saw it committed to the repo. However, when I visit the Netlify deployed website's admin page, the login button says "Login" and then saving entries does not persist after leaving the editing page.

It is also taking around 110 seconds for npm run dev to execute.

Here is my configuration, should I include my github user or just the repo name?

  backend: {
    name: "github",
    repo: "caseyjkey/nebulix-portfolio",
    commit_messages: {
	create: 'Create {{collection}} "{{slug}}"',
	update: 'Update {{collection}} "{{slug}}"',
	delete: 'Delete {{collection}} "{{slug}}"',
	uploadMedia: 'Upload "{{path}}"',
	deleteMedia: 'Delete "{{path}}"'
     }
  },
  search: "true",
  media_folder: "src/assets",
  public_folder: "/src/assets",
  media_library: {
    max_file_size: 2012000,
    folder_support: true,
  },
  collections: [page, post, project, product, menu, settings],
};

Search results on front page.

If a search result is on the index -front page, clicking on the link in the search result doesn't work. Nothing happens. I imagine you'd want to either exclude the front page from the search index, or close just redirect to the front page - close the search modal - on click. BTW, this is a really great theme! Good work!

Remove .env from .gitignore?

Not sure if this is standard practice that everyone knows about except me, but I had to remove .env from .gitignore in order to get Netlify and Vercel builds doing their build job.

My local .env is proper, but both Vercel and Netlify didn't know about it. (Aren't Vercel and Netlify just awesome?)

screenshot 2023-10-11 0841@2x

Postmark configuration

Discussed in #30

Originally posted by getofmeland January 16, 2024
Hi All,

I am trying to get Postmark configured on my version of the site, when I try to submit an email I get the following message:

We could not send your message. Please try again.

I have checked my configuration and server configuration in the env and that all seems to be ok. When I monitor the edge function log, I am getting an alert that : Jan 16, 03:51:55 PM: info SLACK_TOKEN undefined

So I am not even sure if its attempting to go via Postmark.

Has anyone else managed to get this working

Browser compatability - Firefox issue

Hello,
The demo website is not looking probably in Firefox browser, but nicely in Chrome and Edge.
Fx. the blog page is unreadable and looks like this in Firefox:
billede
but like this in Chrome:
billede

False blocking validation when using local backend

1. Steps to reproduce

  1. Start up local backend npm run cms-proxy-server
  2. Create a new project entry
  3. Complete the form with a few tags, title, seo, and image
  4. Publish and then verify the page appears in the Work/Project area
  5. Edit the page and add a add a project feature using the local backend
  6. Click Publish Now

2. Incorrect behavior
The validation message "missing required field" appears but there is no other indication of a field missing on the UI.

3. Work-around
Manually adding the project feature to the file works fine.:

features:
  - name: Year
    value: "2023"

4. Additional
These false validations occurs with several areas and I can report each individually, if preferred.

5. Screenshot
nebulix-validation

Unable to change the logo

I have tried to change the logo to an SVG created in Canva, but it never renders on the build.

I have tried a complex based image but also a very basic text image.

vulnerabilities on install

Windows 10. audit fix and audit fix --force not working.

`# npm audit report

file-type 17.0.0 - 17.1.2
Severity: high
file-type vulnerable to Infinite Loop via malformed MKV file - GHSA-mhxj-85r3-2x55
fix available via npm audit fix --force
Will install [email protected], which is a breaking change
node_modules/astro-imagetools/node_modules/file-type
astro-imagetools *
Depends on vulnerable versions of file-type
Depends on vulnerable versions of imagetools-core
Depends on vulnerable versions of potrace
node_modules/astro-imagetools

sharp <0.30.5
Severity: moderate
sharp vulnerable to Command Injection in post-installation over build environment - GHSA-gp95-ppv5-3jc5
fix available via npm audit fix --force
Will install [email protected], which is a breaking change
node_modules/imagetools-core/node_modules/sharp
imagetools-core <=3.0.2
Depends on vulnerable versions of sharp
node_modules/imagetools-core

xml2js <0.5.0
Severity: moderate
xml2js is vulnerable to prototype pollution - GHSA-776f-qx25-q3cc
fix available via npm audit fix
node_modules/xml2js
parse-bmfont-xml *
Depends on vulnerable versions of xml2js
node_modules/parse-bmfont-xml
load-bmfont >=1.1.0
Depends on vulnerable versions of parse-bmfont-xml
node_modules/load-bmfont
@jimp/core <=0.17.1 || 0.17.3--canary.1136.7f5f5d8.0 || 0.18.0--canary.1133.54bf269.0 - 0.18.0--canary.1135.911ed04.0
Depends on vulnerable versions of load-bmfont
node_modules/potrace/node_modules/@jimp/core
@jimp/custom <=0.17.0--canary.1131.af3cb94.0 || 0.17.3--canary.1136.7f5f5d8.0 || 0.18.0--canary.1133.54bf269.0 - 0.18.0--canary.1135.911ed04.0
Depends on vulnerable versions of @jimp/core
node_modules/potrace/node_modules/@jimp/custom
jimp >=0.3.6-alpha.5
Depends on vulnerable versions of @jimp/custom
Depends on vulnerable versions of @jimp/plugins
node_modules/potrace/node_modules/jimp
potrace >=2.1.2
Depends on vulnerable versions of jimp
node_modules/potrace
@jimp/plugin-print *
Depends on vulnerable versions of load-bmfont
node_modules/@jimp/plugin-print
@jimp/plugins *
Depends on vulnerable versions of @jimp/plugin-print
node_modules/@jimp/plugins

13 vulnerabilities (11 moderate, 2 high)
`

Problem with the 'base' parameter in the astro.config.mjs file

I followed the Astro tutorial to deploy the site on GitHub Pages (https://docs.astro.build/en/guides/deploy/github/). Here are the problems I encountered locally by adding "base: '/portfolio'" to the config:

  1. Running the "npm run dev" command
  • Error in the console:
    [ERROR] [router] Request URLs for public/ assets must also include your base. "/scroll-timeline.js" expected, but received "/scroll-timeline.js".
    [ERROR] [router] Request URLs for public/ assets must also include your base. "/snipcart.css" expected, but received "/snipcart.css".
  • The favicon is not displayed
  • The contact section does not open
  1. Run the npm run build command
  • Console:
    generating static routes src/pages/images/[slug].astro
    [{
    params: { slug: 'about-us' },
    props: { image: '/src/assets//portfolioabout-us.jpeg' }
    }....]
    /images/about-us/index.html Input file is missing

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.