Skip to content

Instantly share code, notes, and snippets.

View She-Codes's full-sized avatar

Nikia Shaw She-Codes

25 followers · 14 following
  • Richmond, VA
View GitHub Profile
@codediodeio
codediodeio / config.js
Last active April 16, 2024 04:46
Snippets from the Firestore Data Modeling Course
import * as firebase from 'firebase/app';
import 'firebase/firestore';
var firebaseConfig = {
// your firebase credentials
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
@davidkpiano
davidkpiano / css-state-machines.md
Last active June 15, 2023 15:26
Article for creating CSS State Machines

As the number of different possible states and transitions between states in a user interface grows, managing styles and animations can quickly become complicated. Even a simple login form has many different "user flows":

https://codepen.io/davidkpiano/pen/WKvPBP

State machines are an excellent pattern for managing state transitions in user interfaces in an intuitive, declarative way. We've been using them a lot on the Keyframers as a way to simplify otherwise complex animations and user flows, like the one above.

So, what is a state machine? Sounds technical, right? It’s actually more simple and intuitive than you might think. (Don’t look at Wikipedia just yet… trust me.)

Let’s approach this from an animation perspective. Suppose you’re creating a loading animation, which can be in only one of four states at any given time:

@andyyou
andyyou / rails_webpacker_bootstrap_expose_jquery.md
Last active August 9, 2022 07:38
Rails 5.2 with webpacker, bootstrap, stimulus starter

Rails 5.2 with webpacker, bootstrap, stimulus starter

This gist will collects all issues we solved with Rails 5.2 and Webpacker

Create Project

# Last few parameters(--skip-* part) is only my habbit not actully required
$ rails new <project_name> --webpack=stimulus --database=postgresql --skip-coffee --skip-test
@justsml
justsml / fetch-api-examples.md
Last active February 24, 2024 18:05
JavaScript Fetch API Examples
@clemlatz
clemlatz / smooth-scroll.js
Created September 6, 2017 08:56
Simple smooth-scroll animation in pure/vanilla javascript
/**
* Smooth scroll animation
* @param {int} endX: destination x coordinate
* @param {int) endY: destination y coordinate
* @param {int} duration: animation duration in ms
*/
window.smoothScrollTo = function(endX, endY, duration) {
var startX = window.scrollX || window.pageXOffset,
startY = window.scrollY || window.pageYOffset,
distanceX = endX - startX,
@andreasonny83
andreasonny83 / .gitignore
Last active April 18, 2024 22:14
Gitignore template for JavaScript projects
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Runtime data
pids
*.pid
@juanbrujo
juanbrujo / getLastRSSFeed.html
Last active March 12, 2020 12:50
Get and display last feed from RSS using JavaScript (jQuery)
<html>
<head></head>
<body>
<div class="noticia">CARGANDO</div>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script>
$(function(){
var url = 'https://www.domain.co/index.xml';
var news = $('.noticia');
anonymous
anonymous / config.json
Created March 7, 2017 19:06
Bootstrap Customizer Config
{
"vars": {
"@gray-base": "#000",
"@gray-darker": "lighten(@gray-base, 13.5%)",
"@gray-dark": "lighten(@gray-base, 20%)",
"@gray": "lighten(@gray-base, 33.5%)",
"@gray-light": "lighten(@gray-base, 46.7%)",
"@gray-lighter": "lighten(@gray-base, 93.5%)",
"@brand-primary": "darken(#428bca, 6.5%)",
"@brand-success": "#5cb85c",
@jakebellacera
jakebellacera / how-to-get-youtube-video-id.md
Last active February 25, 2024 11:24
Learn how to get the ID of any YouTube video.

How to get the ID of any YouTube Video

This article walks you through how to get the ID of any YouTube video.

How to get a YouTube video ID from a youtube.com page URL

You may be watching the video or just happened to visit a link to a video. The video ID will be located in the URL of the video page, right after the v= URL parameter.

@jgravois
jgravois / _webserver.md
Last active April 12, 2024 00:21
a simple guide for getting a local web server set up

Do I have a web server running?

having a web server turned on doesn't necessarily mean you are serving pages on the world wide web. its what allows you to load your own static files (.html, .js etc.) in a browser via http://.

if you're not sure whether or not you have a web server running, no problem! its easy to confirm.

what happens when you visit http://localhost/?