Antonija Šimić tonkec

## fc.ts
type FC<P = {}> = FunctionComponent<P>;

interface FunctionComponent<P = {}> {
    (props: PropsWithChildren<P>, context?: any): ReactElement<any, any> | null;
    propTypes?: WeakValidationMap<P> | undefined;
    contextTypes?: ValidationMap<any> | undefined;
    defaultProps?: Partial<P> | undefined;
    displayName?: string | undefined;
}

## index.jsx
import React, { useRef, useEffect } from 'react';
import p5 from 'p5';

function Game() {
    const audioRef = useRef(new Audio('/path/to/your/audio/file.mp3'));
    let audioButton;

    useEffect(() => {
        // Using p5.js to create the audio toggle button
        const sketch = (p) => {

## index.html
<html>
    <head>
        <title>Nasa prva web stranica</title>
    </head>
    <body>
        <h1> Moj prvi heading. </h1>
        <h2> Moj drugi heading. </h2>
    </body>
</html>

## README.md

      
              1 file
            
          
              1 fork
            
          
              0 comments
            
          
              0 stars
            
          
                tonkec
                / README.md
            
            
              Created
              November 2, 2018 12:22
            
          
    Smallroundears Website

Overview

What is this website for?

This is a website for people to learn about Hippopotami and/or then test them on their knowledge.
What does it do?


## es6_syntax_sugars.js
//why is es6 important
/*

  lots of syntax sugar
  faster solutions
  cleaner solutions

*/

// arrow functions

## ideas_for_meetups.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                tonkec
                / ideas_for_meetups.md
            
            
              Created
              April 9, 2019 08:56
            
              
                Ideas for scss meetups (https://www.meetup.com/S_CSS_Zagreb/)
              
          
Centering 101

vertical and horizontal centering in any situation


Import vs link
flexbox vs grid
Pseudo elements

what, how and why


bem vs. smacss
oocss
Intro to Bulma
family.scss and other cool libraries


## Filter.js
import React from 'react';

const KeywordHighlighter = (props) => {
  const allowedKeywords = ["dosage", "happy", "sunny"]; // just some random words that would be highlighted
  const filteredKeywords = allowedKeywords.filter((word) => props.value.includes(word));
  return (
    <div>
      <textarea
        type="text"
        name="keyword"

## step4.js
const incrementCount = ( {incrementBy = 1 } = {} ) => {
 return {
   type: 'INCREMENT',
   incrementBy
 }
}

## step3.js
const incrementCount = ( {incrementBy = 1 } = {} ) => {
 console.log(incrementBy) // propery on the payload object
 /*
  payload = {
    incrementBy: 5
  }
 */
 return {
   type: 'INCREMENT',
   incrementBy: incrementBy

## step2.js
const incrementCount = ( {incrementBy} = {} ) => {
 console.log(incrementBy) // propery on the payload object
 /*
  payload = {
    incrementBy: 5
  }
 */
 return {
   type: 'INCREMENT',
   incrementBy: typeof incrementBy === "number" ? incrementBy : 1
	type FC<P = {}> = FunctionComponent<P>;

	interface FunctionComponent<P = {}> {
	(props: PropsWithChildren<P>, context?: any): ReactElement<any, any> \| null;
	propTypes?: WeakValidationMap<P> \| undefined;
	contextTypes?: ValidationMap<any> \| undefined;
	defaultProps?: Partial<P> \| undefined;
	displayName?: string \| undefined;
	}
	import React, { useRef, useEffect } from 'react';
	import p5 from 'p5';

	function Game() {
	const audioRef = useRef(new Audio('/path/to/your/audio/file.mp3'));
	let audioButton;

	useEffect(() => {
	// Using p5.js to create the audio toggle button
	const sketch = (p) => {
	<html>
	<head>
	<title>Nasa prva web stranica</title>
	</head>
	<body>
	<h1> Moj prvi heading. </h1>
	<h2> Moj drugi heading. </h2>
	</body>
	</html>
	//why is es6 important
	/*

	lots of syntax sugar
	faster solutions
	cleaner solutions

	*/

	// arrow functions
	import React from 'react';

	const KeywordHighlighter = (props) => {
	const allowedKeywords = ["dosage", "happy", "sunny"]; // just some random words that would be highlighted
	const filteredKeywords = allowedKeywords.filter((word) => props.value.includes(word));
	return (
	<div>
	<textarea
	type="text"
	name="keyword"
	const incrementCount = ( {incrementBy = 1 } = {} ) => {
	return {
	type: 'INCREMENT',
	incrementBy
	}
	}
	const incrementCount = ( {incrementBy = 1 } = {} ) => {
	console.log(incrementBy) // propery on the payload object
	/*
	payload = {
	incrementBy: 5
	}
	*/
	return {
	type: 'INCREMENT',
	incrementBy: incrementBy
	const incrementCount = ( {incrementBy} = {} ) => {
	console.log(incrementBy) // propery on the payload object
	/*
	payload = {
	incrementBy: 5
	}
	*/
	return {
	type: 'INCREMENT',
	incrementBy: typeof incrementBy === "number" ? incrementBy : 1