Major build improvements

[Panquesito7]

Things added/changed:

• Major build improvements.
  • New detailed guide on how to build Devicon locally has been added (Windows & Linux-based systems).
  • Building Devicon on Gitpod.io is now possible with a single click.
  • Sneak peek of new icons can be seen by building locally.
  • A few other improvements were done, such as providing a Geckodriver (latest version) for both Linux 64 and Windows 64.
  • The website will now check if CSS/build files are found in the root directory, otherwise, will use predefined CDN latest release links.
  • P.S.: a few of the file changes (such as the font folder changes or devicon-base.css) weren't changed. Not sure why GitHub displays it like that. 🤔

NOTE: This will need proper testing. I already tested and it works perfectly fine without any issues.
Any doubts, suggestions, or questions, please let me know about it. Thanks! 🙂

[Snailedlt]

I haven't reviewed everything yet, but I don't have more time today, so I figured I'd post this in case you want to look at it before I get the chance to review the rest :)

[lunatic-fox]

Looks good to me! 🚀

Reviews already addressed.

[Snailedlt]

README looks good now 💯

One of the nano icons is still changed and needs to be reverted though.
Other than that I mostly just have some questions to better understand the code.

Not much left now until we can merge 🚀

[Snailedlt]

This change still needs to be reverted

[Panquesito7]

I reverted all the changes in the icon; not sure what else should I do. 🤔

[Snailedlt]

Odd, maybe we can try and find which commit the file was changed in?

[Snailedlt]

File history: https://github.com/devicons/devicon/commits/f8ecce93a4ceb7dd3fb93ab6c7343f2fe458e532/icons/nano/nano-original-wordmark.svg

[Panquesito7]

All I did is copy the nano icon contents from the develop branch. Probably some Git-meta changes or such.

[Snailedlt]

Ahhh, have you tried git revert?

[Snailedlt]

Is this not needed anymore? Could you explain what it did, and why we don't need it anymore?

[Panquesito7]

1. Yes it is needed, but it is added by the script above.
2. The stylesheet file (devicon.min.css) loads all the icons data, colors, etc..
3. As I said, it is added by the JavaScript script above.

[Snailedlt]

I see. It would probably be less code to move the script to the .js file and add a variable, then use that variable here instead of adding the element via the DOM.
That would more closely follow the SOLID principle too

[Panquesito7]

So, you're saying to move the whole script to another JS file and load the script via HTML?

[Snailedlt]

Yes, sort of. Moving it to the .js file, but using Angular features instead of interacting directly with the DOM. It's less complex and less code that way.

[lunatic-fox]

Since this branch has some permissions, here goes the updated fonts.

update-fonts.zip 📚

SHA256: 26d9bbcf761c9edeec84d6445507e2494514dd5b4ce8462fb6b2406b3c0c4ab3
MD5: 395e30870869531dfb681d26b24c140c

This .zip contains:

• devicon.min.css
• fonts/devicon.eot
• fonts/devicon.svg
• fonts/devicon.ttf
• fonts/devicon.woff

[Snailedlt]

@lunatic-fox

Thanks. It works perfectly with those fonts!

How did you build it, and which OS do you use?

[lunatic-fox]

@lunatic-fox

Thanks. It works perfectly with those fonts!

How did you build it, and which OS do you use?

I made a script with Node.js to get all valid icons to upload to Icomoon and I'm on Windows 10.

[Snailedlt]

@lunatic-fox care to share the script? :)

[lunatic-fox]

@lunatic-fox care to share the script? :)

I made it first with local files, but I've made another version using fetch.
This will need a icomoon directory created and Node.js 17.5.^.

const fs = require('fs');
const baseURL = 'https://cdn.jsdelivr.net/gh/devicons/devicon@develop/';
(async() => {
  const devicon = await(await fetch(`${baseURL}devicon.json`)).json();
  for (const e of devicon) {
    for (const f of e.versions.font) {
      const icon = await fetch(`${baseURL}icons/${e.name}/${e.name}-${f}.svg`);

      if (icon.status === 200) {
        console.log(`> ${e.name}-${f}`);
        fs.writeFileSync(`icomoon/${e.name}-${f}.svg`, await (icon.text()));
      }
    }
  }
})();

[lunatic-fox]

@lunatic-fox care to share the script? :)

I made it first with local files, but I've made another version using fetch. This will need a icomoon directory created and Node.js 17.5.^.

Here goes a faster version:

const fs = require('fs');
const baseURL = 'https://cdn.jsdelivr.net/gh/devicons/devicon@develop/';
(async() => {
  let x = 0, y = 10;
  const devicon = await(await fetch(`${baseURL}devicon.json`)).json();
  const toBuild = [];

  while (true) {
    const deviconChunk = devicon.map(e => ({
      name: e.name,
      font: e.versions.font
    })).slice(x, y);

    if (deviconChunk.length === 0) break;

    for (const e of deviconChunk) {
      for (const f of e.font) {
        const icon = await fetch(`${baseURL}icons/${e.name}/${e.name}-${f}.svg`);
  
        if (icon.status === 200) {
          const svg = await icon.text();
          toBuild.push({
            path: `${e.name}-${f}.svg`,
            icon: svg
          });
          console.log(`> ${e.name}-${f}`);
        }
      }
    }
    x += 10, y += 10;
  }

  toBuild.forEach(e => fs.writeFileSync(`icomoon/${e.path}`, e.icon));
})();

[Snailedlt]

Looks good! ✔️

Like we already discussed, I had trouble running it locally. If the issue persists we can look at that later. For now it's good enough that it runs on GitPod imo :)
Let's get this release out ASAP :D