Skip to content

Instantly share code, notes, and snippets.

View srele96's full-sized avatar
💭
...

Srecko Kostic srele96

💭
...
  • NETCONOMY
  • Serbia, Belgrade
View GitHub Profile
@srele96
srele96 / react-rules.txt
Created March 26, 2021 11:46
React rules for skadi
React rules
1. One file, one component
example: Button.js -> function Button(props) {} export default Button;
2. File name is same as component name
example: Menu.js -> function Menu(props) {}
3. Wrap multi line jsx in parentheses
example:
@srele96
srele96 / multi-component-export
Created March 26, 2021 12:43
How to group and export similar react components from one file
Folder structure:
root -
-
- components -
- -
- - Weapons.js
- - Armor.js
- - GroupedComponents.js
- Menu.js
1. Jungle Cruise
2. Black Widow
3. Snake Eyes: G.I. Joe Origins
class Interaction(models.Model):
isLiked = models.BooleanField(null=True)
user = models.ForeignKey(
User, related_name='interactions', on_delete=models.CASCADE
)
movie = models.ForeignKey(
Movie, related_name='interactions', on_delete=models.CASCADE
)
class InteractionSerializer(serializers.HyperlinkedModelSerializer):
@keyframes fade {
from {
opacity: 1;
} to {
opacity: .2;
}
}
.alternate-fade {
animation: fade 1s cubic-bezier(.3,.68,.75,.39) infinite alternate;
function StadiumColumn({ className }) {
return (
<div className={`stadiumColumn ${className}`} />
)
}
function Stadium() {
return (
<div className="stadium">
<StadiumColumn className="alternate-fade" />
function StadiumColumn({ className }) {
return (
<div className={`stadiumColumn ${className}`} />
)
}
function Stadium() {
return (
<div className="stadium">
<StadiumColumn className="alternate-fade alternate-fade--delay-six" />
@keyframes fade {
from {
opacity: 1;
} to {
opacity: .2;
}
}
.alternate-fade {
animation: fade 1s cubic-bezier(.3,.68,.75,.39) infinite alternate;
<html>
<head>
<title>Responsive web apps</title>
</head>
<body>
<article>
<h1>Burger recipe</h1>
<p>
In this article I am going to list ingredients