yordanzhelevdev

import React, { Component } from "react";
import { CSSTransitionGroup } from 'react-transition-group';
import './carousel.css';

export const images = [
  'images/grill.jpg',
  'images/grill2.jpg',
  'images/grill3.jpg'
];

yordanzhelevdev

#GulpJS + SASS + BrowserSync ftw Being the new-kid-on-the-block, GulpJS is getting plently of attention lately. Instead of contributing to the pool of opinion-pieces out there though, I thought I'd walk you through setting it up with a really nice little workflow including SASS for CSS along with my open-source project, BrowserSync.io.

The end result will be a pretty sweet front-end development setup including:

• SCSS File watching/compilation.
• Live CSS injecting into multiple devices.
• A Server running on an IP address that can be accessed on multiple devices/screens.
• Syncronized scroll, clicks, links & form fields across all devices.

yordanzhelevdev

<!-- ABOUT US - SECTION -->
<section class="about-us">
	<div class="container">
		
		<div class="row">
			<article class="col-md-6">
				<div class="row">
					<figure class="col-md-6">
							<img src="https://images.pexels.com/photos/541525/pexels-photo-541525.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" alt="" />
					</figure>

yordanzhelevdev

yordanzhelevdev

class Child extends React.Component {
    constructor (props) {
        super(props);
    }

    onFieldChange(event) {
        // for a regular input field, read field name and value from the event
        const fieldName = event.target.name;
        const fieldValue = event.target.value;
        this.props.onChange(fieldName, fieldValue);

yordanzhelevdev

<?php

// Links
$res = ads_data(array('position' => 3));
if ($res) links_html($res);

// Boxes
$cats_data = categories_data();
?>

yordanzhelevdev

/ renderEditRecipe(key) {
  //   const recipe = this.props.recipes[key];
  //   return (
  //   <div className="modal">
  //         <form
  //           name="recipeForm"
  //           ref={input => (this.recipeForm = input)}
  //         >
  //           <div className="inputsContainer">
  //             <div className="recipeInputs">

yordanzhelevdev

https://www.oo-software.com/en/shutup10
https://packagecontrol.io/packages/Discord%20Rich%20Presence - sublime text 3 package
https://medium.com/@samerbuna/the-mistakes-i-made-as-a-beginner-programmer-ac8b3e54c312 - to read
https://www.toptal.com/designers/subtlepatterns/ - Cool css patterns
http://www.corelangs.com/css/box/zoom.html

yordanzhelevdev

Sublime Projects 📁

You can create Projects which contains multiple folders and can have individual settings depending on the project. A project is a folder or a group of folders saved at a certain state that will be remembered everytime you close the project.

You can also quick switch between projects with CMD + CTRL + P or CTRL + ALT + P

If your are using Atom or vscode there is a plugin to add this behavior:

• Atom Project Manager
• VSCode Project Manager

yordanzhelevdev

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
  
  //CSS