#coding resources

[uroboros-if]

Fade to Black Macro

Demo

I have finally turned my fade to black transitions into a somewhat easy to use macro!! :) I am not sure if this has been done before!

Customizable fade times

Built to be compatible with backward and forward buttons (mostly!)

Works across all screen sizes

Note: This is only for SugarCube.

Setup

Copy and paste this Pastebin to your Story JavaScript.

Copy and paste this Pastebin to your Story Stylesheet.

Make a new passage titled exactly as "black_fade". Add the passage tag, "black-fade". Inside, write <div id="black"></div>. Super important! Copy below identically.

After this, your installment of the macro should be complete!

Usage

In the passages where you will be fading from and where you will be fading to, tag it as "passage-fade". For example, I want to transition from "p1" to "p2" with a black fade. Thus, both p1 and p2 should have the tag.

In the passage where you will be fading from, write <<fadestart>>.

Use the <<link>> macro to link to your destination. Inside the link macro, use <<passagefade "[passage name]" [fade time]>> where [passage name] is the passage you want to go to, and fade time is how long the black fade will be in miliseconds. (1000ms = 1s). However, do NOT put the passage you will be going to in the <> macro itself. See below:

Here, I want to go to the passage "p2". Do NOT write <<link "Next passage" "p2">><</link>>. Do not provide the destination passage in the link macro itself. The macro <<passagefade>> will handle it for you if you specify the passage name in the first argument.

Once you do all this, you should be able to sit back and happily use it as you please!

Problems?

Make sure you have the passage "black_fade" titled exactly like that.

Also make sure it has <div id="black"></div> and nothing more!

Make sure "black_fade" is tagged with "black-fade".

Make sure you used <<fadestart>> in the passage you are transitioning from.

Make sure you are correctly using the macro <<passagefade>>. You specify time in miliseconds; it should not have "ms" or "s" included in the argument. It should just be the number (e.g. 4000 for 4 seconds).

Make sure the passages you are fading from and to are tagged with "passage-fade".

There may be CSS/HTML that is interfering with the look of the fade!

There may be other JavaScript code interering with the current code.

If you are having problems, please let me take a look at your Stylesheet or let me know what template you are using! However, I highly recommend looking at the playable and downloadable demo.

(This macro is free to use, free to copy for all commercial and non-commercial projects with no additional fees. Credit is appreciated!)

[larkingame]

hi :) my video about how toxic the coding community can be online is up and ready to go! i worked really hard on it so I hope you give it a watch!

also, i've attached it i the description, but if you're looking to learn to code, or develop a text-based game, I've compiled this list of resources here!

[izicodes]

C# Study Links | Resources ✨

As I am starting to relearn C#, I thought why not share some links that have helped me in the past and what new ones I will be using this time to learn! I already made a similar resource post (post 1 | post 2) for C# in the past but why not a new one? 🤗

Microsoft Learn - LINK

C# Station - LINK

YouTube - LINK

SoloLearn - LINK

Codecademy - LINK

Learn C# - LINK

C# Yellow Book - LINK

C# Programming Guide - LINK

Tutorials Point - LINK

Roadmap to ASP.NET Core Developer (C#): LINK

C# Subreddit - LINK

Dot Net Perls - LINK

C# Coding Conventions - LINK

The Ultimate C# Guide For Beginners - LINK

That's all for now! If this does interests you, do check out the other posts (1 | 2) I made of other C# resources!

Happy coding/programming! 😎💻👍🏾

[southcodes]

fashion. | preview , code

minimalistic about page with a dash of color in the background

design by https://dribbble.com/shots/14013228-web-design/attachments/5629278?mode=media

responsive design

sidebar with icon image, vertical title and custom links

topbar for main links (home, inbox, follow)

main section with details, about text and an image

normalize css by https://github.com/necolas

icon font by https://feathericons.com/

is something wong? need help? let me know! if you’d like, you can support me on paypal or ko-fi

[lunacoding]

SQL Interactive Websites

Hi! I wanted to share some websites that have helped me with bettering my SQL skills and are interactive, as in you can learn as you practice SQL on the website through an educational or fun way! 

SQL Bolt

This website is one of the best for beginners to SQL as it helps with explaining the different SQL statements as well as giving brief interactive exercises for each explanation/topic. Additionally, it offers help on more intermediate topics as well such as subqueries. However, this site doesn’t have many resources on more advanced SQL topics, so it may not be best if you’re more intermediate in SQL, but could be good for a basics refresher.

SQL Zoo

This website is another one which is good for beginners to SQL as similarly to SQL Bolt, it primarily explains different SQL statements and queries. There are brief interactive exercises as well as quizzes on various SQL topics. Additionally, there are assessments for more advanced users of SQL to test their knowledge which consist of 15 questions for different databases, including dressmaker, musicians, help desk, and so forth.

Select Star SQL

This website is an interactive SQL exercise where you learn as you go while interacting with a database of death row patients. The difficulty of queries slowly increases as you go through the exercise. I find this website helpful as it threw me into SQL and I prefer the learning while doing method, especially with real-world data. This could potentially be triggering if you don’t want to read the details of people being on death row.

SQL Murder Mystery

This website is an interactive SQL exercise where you try to figure out who committed a murder using SQL. This website is good for both beginners and more intermediate SQL learners. It offers a walkthrough for people who are completely new to SQL. Alternatively, the website gives schema details to those experienced with SQL and want to figure it out on their own.

SQL Police Department

This website is similar to SQL Murder Mystery where you try to figure out police cases through learning SQL. It has prompts where you then use SQL to try to figure out the information the police need. The site also has a guide on SQL and gives basic summaries on different queries. I found this site fun to use and it has a cool interface. However, one con of this site is you can only do a certain amount of SQL queries before it asks you to pay for the longer version of the site.

Practice SQL

This website has been my personal favorite as the interface is clean and easy to understand. The website gives you prompts to use SQL to select from two different databases, the first of which is based on doctors and patients in different provinces while the the second is based on products and their orders as well as employees who work at the company. For both of these databases, there’s a series of prompts/questions from easy to intermediate to advanced SQL. Additionally, there’s learning resources which helps explain different queries and functions of SQL as well, if you’re confused or need help!

I hope you guys find these websites helpful!!

[heartbeam]

ROLEPLAY LAYOUTS | by heartbeam layouts ideal for a single muse! you can find these layouts on discord.

[sagecodex]

I know I’m not the only one who struggles to find the right fonts for my projects. So I put together a list of places to find good, free, legal, fonts to use in all of our websites. This list may be short, but it’s curated to help you find the best fonts in the easiest way, and without having to worry about all the legalese.

If there are any free font resources you like to use that I’ve missed, let me know! 

Google Fonts

Google Fonts is a great resource, and the go-to font repository. They make it easy to select and install fonts on your website—just click the font you want and copy the code! There’s over 1,455 font families to choose from, plus some great resources on typography, guides on how to choose the best fonts, and more.

All Google fonts are 100% free for personal and commercial use. The most common license is the SIL Open Font License. Some fonts are under the Apache license or Ubuntu Font License. You can redistribute open source fonts according to those conditions.

Fontshare

Similar to Google Fonts, Fontshare is a free fonts service launched by the Indian Type Foundry (ITF). Their mission is accessibility, so every font they release and promote is open source. There are 100 font families to choose from, as well as curated font pairings to help you pick! Like Google Fonts, they make it easy to install, just pick the font(s) you like and copy the code.

All Fontshare fonts are 100% free for personal and commercial use. They are offered on two licenses: Closed Source, which are are governed by ITF’s Free Font License (FFL) , and Open Source, which  are governed by SIL Open Font License (OFL). You can read more about their licensing here.

The League of Moveable Type

The League is the world’s first open source type foundry. They have some great fonts, as well as a newsletter, a podcast, and some tools to help you learn typography! You’ll need to download and install all of their fonts on your own website, but many of their fonts are also found in the first to foundries as well for easier install.

All the fonts from The League of Moveable Type are free & open source, available to use commercially and subject to the Open Font License.

Indestructible Type*

While its library is small, it has some very unique, iconic fonts. The designer only makes high quality, versatile, modern fonts that are accessible to everyone. If you’re familiar with fonts, you probably already know some of their core styles, but there are a few unique styles we don’t see used enough!

These fonts are licensed under the SIL open font license and are free for commercial use.

Font Squirrel

A great resource with thousands of available fonts for free commercial use. They also have a great font identifier tool, plus a forum to talk about fonts and typography. You do need to download the fonts and upload them into your own site. 

Unlike the other sites in this list, do be careful when selecting your fonts. While they do mark their fonts with what they think their individual licenses allow, there is no guarantee. So be sure to read their individual licenses and read Font Squirrel’s FAQ before using!

Other Free Font Resources

There are other places you can find good, free, legal fonts to use, but they are less reliable and often offer fewer free versions to promote premium paid fonts. Just be sure to read the individual font licenses before you use them. So check out these sites if you’re willing to dig around and see what you can find: Dribbble, Behance, Pixel Surplus, Graphic Pear, Fontbundles.net, Wild Picks, Sunrise Digital, Fontfabric, Pixelify, Font Shop, FontHaus, FontSpace, and MyFonts.

How to embed webfonts

Some of the linked resources give you easy links to install their fonts—but others require you to download the font and embed it into your website. So here’s the w3 article to show you how!

Remember: always use fonts with an open commercial license, specifically for the web. Using demo fonts or fonts designated for personal use on your website is not only bad practice (and usually not web-optimized), it’s almost always illegal! Personal use means for use on your single desktop (like when typing in a word doc) or for the free invitations you made for your dog’s fourth birthday. Everything else (including embedding a webfont) is almost always commercial.

Note: It is not advised to use sites like Dafont, Fontriver, 1001 Fonts, etc. to find fonts for your projects. While they do have free fonts, they are almost exclusively demo versions of commercial fonts that you need to buy a license to use on the web. Please read the license for every font you download to keep yourself out of trouble.

[beedesigns]

My Favourite VS Code Extensions

This actually started with a conversation about favourite VS Code themes which got me to thinking. But as always I had to be that little bit extra. So, here are a few of my favourite VS Code extensions that I think would be particularly helpful for new coders or folks just starting with VS Code.

These are in no particular order! I've tried to keep the list to extensions that help read your code and make thinsg pretty. There are hundreds of extensions for almost every type of code, but I wanted focus on ones for beginners. Ones that won't encourage you to become too lazy relying on shortcuts. So, with no further ado, here we go:

Colorize

This extension will highlight any colours (hex, rgb, hsl etc) in your code.

Auto Rename Tag

Okay, this one might make you a little bit lazy. Sometimes you need to switch things up, and that can start to get complicated if you're working on a lot of code. This extension will change the opening or closing tag name paired with the one you manually change. It prevents mispellings that will break your code and makes life easier.

Spellcheck

Ever typed heder instead of header? Or justfy-content instead of justify-content? Well, this extension will help pick up on those typos and keep your code clean (and working!).

Indent Rainbow

This is such a small thing, but possibly one of my favourites on the list. Indent rainbow does pretty much what it says on the tin, adding a coloured line down the lefthand side along the indent of your code. It looks pretty and helps easily keep track of where you are.

Color Picker

Who doesn't love beautiful colours? Colour Picker lets you choose all the beautiful colours you could want without having to leave VS Code.

HTML Checker

This extension helps prevent errors by checking your code against the W3C Markup Validation Service searching for errors. Great of avoiding issues further down the line. Useful for beginners and pros alike to be honest.

Rainbow Brackets

I tend to find this one more useful in javascript, but it's good for everything. I used to use another, also called Rainbow Brackets but that's been depricated, and I like the default colours in this one. There are a few, so shop around.

Prettier

This extension forces a set format on your code, keeping things neat and tidy. It can take a little getting used to but the documentation is pretty good. Helps build good habits, keeping things uniform and easy to read.

These are just a few of the ones I've personally got installed. As I mentioned, there are hundreds of different extensions. Many of which will do the same thing. So, make sure you have a look around and find what works best for you!

Which extension would you recommend for a beginner?

[swgzl]

Une idée lancée ainsi !

Je suis archi dispo pour coder des forums, aider pour des problèmes ou n'importe quoi ! j'ai déjà codé plusieurs forum from scratch avec l'aide de quelques libres services, toujours crédités. Mais si jamais vous cherchez une codeuse pour faire des forums, je suis dispo (je peux vous montrer ce que j'ai déjà fait si jamais) ! je sais que j'aime beaucoup travailler avec des idées déjà faites, même en schémas archi basiques, car mon niveau DA est faible encore.

[interact-if]

Hello! I wanted to learn either twine or html in my spare time (I am not planning to be an author or anything, just maybe help someone code their story once I have an handle of it) which one do you think'd be better?

Hi there,

Twine is a compiler that creates games in an HTML file, from code in a specific coding format (Harlowe, SugarCube, Chapbook, Snowman, etc...). You do not require knowledge of HTML to create a game in Twine, but you will need to learn one of its format to code.

Still, HTML (and CSS) can be helpful in more advanced projects, especially in regards to building a UI.

If you are trying to help someone coding their project in Twine, we recommend you start with the chosen Twine format first.

~~

Note: the best program out there is one that works for you and the project. There are a lot of programs and formats to create IF out there, all with their advantages and faults. We advise you to look into a few programs and test them out, see what you could be comfortable with.

Note 2: while many programs have their own specific coding language, some may require extra knowledge in HTML/CSS, or JavaScript/jQuery, or Python, or C++, etc... depending on what you are trying to attempt.

[uroboros-if]

Multipronouns in SugarCube

Hello guys!! So sorry for my absence! I've made JS code free for anyone to use in their Twine game, which allows you to have multiple pronouns for your main character -- for example, she/they, she/he, she/he/they, whatever combination!

Some features include:

Completely customizable, and therefore neopronouns-friendly!

No limitations as to how many sets of pronouns you can add—you can add even just one.

Can determine singular and plural pronouns, even if you use pronouns that are different

Automatically switches between pronouns -- and you only need to write ?mcthey, ?mcthem, etc.

If you want to stick to one pronoun temporarily (e.g. so a character refers to MC as she/her and not switch to they/them mid-sentence), it is possible, too!

DEMO (playable online + downloadable) // CODE (+ documentation)

SHOUTOUT to @magiciansvoyage for inspiring me to do this for Twine!! :)

Why I Did This

I was inspired by @magiciansvoyage (!!!) who made multipronouns in CS, and I wanted to make multipronouns in Twine. Shout to them for this, they're amazing!!

I'm aware there are other gender code out there, but as far as I know, I don't know of any that can have multiple pronouns and switch between them using she/her and they/them automatically, for example.

How to Implement?

Just copy and paste the JavaScript code into your JavaScript, and copy and paste the variables into your StoryInit passage! Link to code here!

You can find the macro with in-depth explanation of what everything does here! I will include a How To underneath the readmore as well for a quick and dirty, but you will still benefit a lot from reading through the readme on GitHub.

How to Use?

This section will be more process-oriented than detail-oriented. For a better explanation on ?mcthey, $mc_they, and the <<gender>> macro, look at my readme on GitHub where you pull the code!

The Setup

Allow the player to add their pronouns for themselves as you would normally. Set these to $mc_they, $mc_them, $mc_theirs, $mc_themself, and $mc_plural (true if plural, false if singular).

Then, you can add this to your MC's pronouns with < < gender $mc_they $mc_them $mc_their $mc_theirs $mc_themself $mc_plural > > (had to add a space between the triangle brackets because Tumblr is weird). This will add that set of pronouns, which will be in rotation throughout the story. Make sure to add every argument, or else the macro will complain you've added too little.

When you want the player to add a new set of pronouns, repeat steps 1 and 2. You can keep prompting the player to add pronouns until they're satisfied. Make sure you give them a confirmation and reiterate what pronouns they've added, as there will be no way to remove pronouns once done (I may add this feature in the future if needed).

In-text

If you want to change between she/they, use ?mcthey or ?mcThey for capitalization. For her/them, use ?mcthem or ?mcThem. And so on.

If you want to use is/are, use $mc_is (a $ this time, not a ?), or $mc_was if you're writing in past tense. It will take the latest pronoun mentioned to determine whether to use is/are. If "they" was last mentioned, it will use "are". If "she" was last mentioned, it will use "is".

If you want to use a contraction like they're or she's, then use ?mctheyre or ?mcTheyre.

If you want to stick to one pronoun temporarily, use $mc_they, $mc_them, etc. It will stick to the last pronoun mentioned by ?mcthey, ?mcthem, etc.

If you want to use singular verb vs. plural verb, use $mc_s. Again, it will take the latest pronoun mentioned to determine whether to add "s" to a verb or not.

I also added $mc_has that follows the same logic as $mc_is to determine has vs have.

If this isn't super clear, make sure to read the readme. Also, feel free to DM or ask questions otherwise! :)

[quietmarie]

Anyone can program (yes, even you)

"Programming is easy"

I saw some variations of this statement shared around the site recently, always in good intentions of course, but it got me thinking.

Is that really true?

Well it certainly isn't hard in the way some developers would want to make you believe. A great skill bestowed only upon the greatest of minds, they're the ones making the world work. You better be thankful.

That is just elitist gibberish. If anyone ever tells you that programmers are "special people" in that way, or tries to sell you on the idea of "real" programmers that are somehow better than the rest, you can safely walk in the other direction. They have nothing of value to tell you.

But I think the answer is more complicated than a simple "Yes, programming is easy" too. In all honesty, I don't think it's an easy thing to "just pick up" at all. It can be very unintuitive at first to wrap your head around just how to tell a computer to solve certain problems.

One person in the codeblr Discord server likened it to cooking. That's a skill that can be very hard, but it's also something that everyone can learn. Anyone can cook. And anyone can program.

I really mean that. No need to be good at maths, to know what a bit is or whatever it is people told you you need. You're not too old to learn it either, or too young for that matter. If you want to start programming (and you can read this post), you already have everything you need. You can write your first little programs today!

One of the cool things about programming is that you can just fuck around and try lots of stuff, and it's fine. Realistically, the worst thing that can happen is that it doesn't work the way you imagined. But you'll never accidentally trigger the fire alarm or burn your house down, so feel free to just try a bunch of stuff.

"Okay I want to learn programming now, what do I do?"

That's awesome, I love the enthusiasm! As much as I'd love to just give you a resource and tell you to build a thing, you still have to make a choice what you want to learn first. The options I'd recommend are:

Scratch: A visual education tool. The main advantage is that you don't have to worry about the exact words you need to write down, you can just think about the structure of your program. The way it works is that you drag and drop program elements to be executed when they should be. You can relatively quickly learn to make cute little games in it. The downside is that this isn't really a "professional" programming language, so, while learning from Scratch will give you the basics that apply to most languages and will make switching to another language easier, you're still gonna have to switch sooner or later. Start here: https://scratch.mit.edu/

Python: The classic choice. Python is a very widely used, flexible programming language that is suited for beginners. It is what I would recommend if you want to skip right to or move on from Scratch to a more flexible language. https://automatetheboringstuff.com/ is your starting point, but there's also a longer list of resources here if you want to check that out at some point.

HTML/CSS/JavaScript: The web path. HTML and CSS are for creating the look of websites, and JavaScript is for the interactive elements. For example, if you ever played a game in your browser, that was probably written in JS. Since HTML and CSS are just for defining how the website should look, they're different from traditional programming languages, and you won't be able to write programs in them, that's what JS is for. You have to know HTML before you learn CSS, but otherwise the order in which you learn these is up to you. Your JavaScript resource is https://javascript.info/, and for HTML and CSS you can check out https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web.

I put some starting out resources here, but they're really just that - they're for starting out. You don't have to stick to them. If you find another path that suits you better, or if you want to get sidetracked with another resource or project, go for it! Your path doesn't have to be linear at all, and there's no "correct" way to learn things.

One of the most important things you'll want to do is talk to developers when you struggle. The journey is going to be frustrating at times, so search out beginner-friendly coding communities on Discord or wherever you're comfortable. The codeblr community certainly tends to be beginner-friendly and kind. My DMs and asks are also open on here.

[izicodes]

Harvard University Free IT Courses | Resources ✨

While scrolling through Twitter, I saw some posts that highlighted some free IT courses and resources being offered by Harvard University! Harvard University offers a wide range of IT courses that are available to the public for free! Here are some of them!

1. Introduction to Computer Science - LINK

An introduction to the intellectual enterprises of computer science and the art of programming.

2. Web Programming with Python and JavaScript - LINK

This course dives more deeply into the design and implementation of web apps with Python, JavaScript, and SQL using frameworks like Django, React, and Bootstrap.

3. Mobile App Development with React Native - LINK

Learn about mobile app development with React Native, a popular framework maintained by Facebook that enables cross-platform native apps using JavaScript without Java or Swift.

4. Introduction to Game Development - LINK

Learn about the development of 2D and 3D interactive games in this hands-on course, as you explore the design of games such as Super Mario Bros., Pokémon, Angry Birds, and more.

5. Introduction to Artificial Intelligence with Python - LINK

Learn to use machine learning in Python in this introductory course on artificial intelligence.

Hope this helps someone and do check them out! 💻👍🏾💗

[lunacoding]

SQL GitHub Repositories

I’ve recently been looking up more SQL resources and found some repositories on GitHub that are helpful with learning SQL, so I thought I’d share some here!

Guides:

s-shemee SQL 101: A beginner’s guide to SQL database programming! It offers tutorials, exercises, and resources to help practice SQL

nightFuryman SQL in 30 Days: The fundamentals of SQL with information on how to set up a SQL database from scratch as well as basic SQL commands

Projects:

iweld SQL Dictionary Challenge: A SQL project inspired by a comment on this reddit thread https://www.reddit.com/r/SQL/comments/g4ct1l/what_are_some_good_resources_to_practice_sql/. This project consists of creating a single file with a column of randomly selected words from the dictionary. For this column, you can answer the various questions listed in the repository through SQL queries, or develop your own questions to answer as well.

DevMountain SQL 1 Afternoon: A SQL project where you practice inserting querying data using SQL. This project consists of creating various tables and querying data through this online tool created by DevMountain, found at this link https://postgres.devmountain.com/.

DevMountain SQL 2 Afternoon: The second part of DevMountain’s SQL project. This project involves intermediate queries such as “practice joins, nested queries, updating rows, group by, distinct, and foreign key”.

[kalorphic]

i may or may not have i IF in the making, a sapphic werewolf IF about learning to love yourself with everything. is pretty angsty but also sweet. :o)

I'm still not sure if i should, i don't know if people are gonna like it and coding scares me. :o(

Trust me, there’s going to be a following there for sweet but angsty sapphic werewolves (I will definitely be one of them) 👀 but at the end of the day, as long as you love your story and you’re interested in it, that should be all that matters (although I do know that’s easier said than done)!

As for coding, that’s still a massive hurdle for me and several other authors. Looking up tutorials on youtube or other IF accounts or using the many resources that are available online can be a huge help though and has got me through a lot. I will put in the tags the hashtags that I’ve used to tag those resources, so I’d suggest having a look through those!

Good luck though, lovely! I know it can all seem a bit daunting, but a lot of the authors in this community would be happy to help a fellow author out with coding if you messaged them or sent them an ask (I put out cries for coding help all the time lol). So, if this is something that you want to do, then I’d say go for it !! <3

[manonamora-if]

Want to find the perfect Google Font but keep pulling your hair out because the search bar only allow the font name and not its vibe.

Well I found a neat website.

You're welcome :)