Skip to content

New highlight.js website! Help us test it 😄 #3611

Open
@allejo

Description

@allejo

Hello everyone! I'm by no means someone you see hanging out in this repo often; I stop by whenever code reviews are needed or a second opinion is wanted. Something I've been working on for months now (on and off) is a new website for our beloved syntax highlighting library 🥳

Our new website is powered by Next.js and is generously hosted by Heroku Netlify (for now). We need your help testing the new website, giving us feedback, reporting bugs, etc.

I've tried my best to meet feature parity with the current website, reorganizing some pages, and adding a much-requested demo page!

Website: https://highlightjs.org/ (aka, https://hljs.netlify.app)
GitHub repository: https://github.com/highlightjs/highlightjs.org
Report issues here: https://github.com/highlightjs/highlightjs.org/issues

Ideally, we'd like to go live with the new website towards the end of September, early October.

Administrative Tasklist

  • Switch DNS for https://highlightjs.org/ to point to Heroku
    Build Github Workflows for new highlight.js releases to trigger a new website build

/cc @highlightjs/core

Activity

pinned this issue on Sep 8, 2022
taufik-nurrohman

taufik-nurrohman commented on Sep 8, 2022

@taufik-nurrohman
Member

FYI, the language pack generator feature is very useful. Wish there will be a public API that I could use to generate my own language set through my application. An API URL that simply return a plain text response that I could save as highlight.js for example.

allejo

allejo commented on Sep 8, 2022

@allejo
MemberAuthor

FYI, the language pack generator feature is very useful. Wish there will be a public API that I could use to generate my own language set through my application. An API URL that simply return a plain text response that I could save as highlight.js for example.

Underneath the new /download page lives an undocumented (as of this moment) /api/download endpoint that accepts POST requests (watch your browser's Network tab) with a JSON body in the structure of,

{
  "api": 2,
  "languages": []
}

This API endpoint returns an attachment response with the bundled zip file. I'm open to considering adding an endpoint that returns just the JS and not the entire zip.

joshgoebel

joshgoebel commented on Sep 8, 2022

@joshgoebel
Member

I'd suggest perhaps a format: [zip,javascript] choice perhaps?

joshgoebel

joshgoebel commented on Sep 8, 2022

@joshgoebel
Member

Some indication that "Docs" and "GitHub" were going to jump you to another site might be nice... I always frown when I see links in "sitewide navigation" that link to entirely different sites without any warning. Maybe move them to right with a | inbetween with a diff color/shade?

joshgoebel

joshgoebel commented on Sep 8, 2022

@joshgoebel
Member

Does VS Code use us directly or just in plugins? If we're not in the default install I think that's a little deceptive and we should remove them from the list and find another big site.

isagalaev

isagalaev commented on Sep 8, 2022

@isagalaev
Member

This looks really nice :-) Glad you kept the color scheme!

joshgoebel

joshgoebel commented on Sep 8, 2022

@joshgoebel
Member

This looks really nice

Yes, it looks amazing.

I totally should have led with that before jumping into my [overall] minor nitpicks... I'd be fine launching it just as soon as we hook up the Github actions to deal with new releases... and of course we can continue to improve post-launch as well... or I'm also ok with the plan to test a bit longer (or wait for more feedback), then launch.

@allejo Were you planning to help setup the GH actions also? I think some of the work we've already done with auto-publishing the cdn-release gem might be relevant? I imagine we're talking two parts:

  • GH action here pushes to Heroku on now commits, etc
  • GH release on main repo updates this repo's "source" files? (or bumps a version or something)

I haven't looked too deeply into the programming here yet.

allejo

allejo commented on Sep 9, 2022

@allejo
MemberAuthor

Does VS Code use us directly or just in plugins? If we're not in the default install I think that's a little deceptive and we should remove them from the list and find another big site.

That's true 🤔 As far as I know, VSC uses hljs for syntax highlighting of markdown code blocks in previews. I'd welcome any other websites/services that use us to replace VSC!

Were you planning to help setup the GH actions also? I think some of the work we've already done with auto-publishing the cdn-release gem might be relevant?

Yes! I'll be looking into the GitHub actions for syncing releases. I think there will definitely be shared logic between these actions

  • GH action here pushes to Heroku on now commits, etc

Heroku provides a GitHub app that syncs stuff for us, this is already taken care of 🥳

  • GH release on main repo updates this repo's "source" files? (or bumps a version or something)

Correct, it'd bump the package.json file in the website's repo to the latest release and rebuild everything from there.

joshgoebel

joshgoebel commented on Sep 9, 2022

@joshgoebel
Member
ghost
Hirse

Hirse commented on Oct 18, 2022

@Hirse
Contributor

As someone who's in the past contributed to the (old? current?) website, the new one is looking nice!

A few things I noticed:

  • different favicon, is that intentionally?
  • Links to Docs and GitHub not opening in new tab
  • Add link to npm?
  • Update default theme (or add new default-dark) to use on the website?
  • "News" -> "Releases"?
  • I like the design of the news, but it doesn't really match the rest of the page
  • Why is "Code Samples" such a tiny link in the bottom?

Happy to contribute for the above. 😄

15 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    big picturePolicy or high level discussionhelp welcomeCould use help from community

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @joshgoebel@isagalaev@allejo@wil93@taufik-nurrohman

        Issue actions

          New highlight.js website! Help us test it :smile: · Issue #3611 · highlightjs/highlight.js