Skip to content

Instantly share code, notes, and snippets.

Avatar

Ekaterina Prigara prigara

View GitHub Profile
@prigara
prigara / changed-mac-os-shortcuts.md
Last active Nov 20, 2020
macOS system shortcuts keymap for WebStorm vs default keymap
View changed-mac-os-shortcuts.md

The macOS System Shortcuts Keymap for WebStorm is available in the Plugin Marketplace.

Changed shortcuts

Action Old shortcuts New shortcuts
View Simple class component
class Welcome extends Component {
render() {
return <h1>Hello, {this.props.name}</h1>;
}
}
@prigara
prigara / demo.js
Last active Feb 28, 2019
Debug console in WebStorm 2019.1
View demo.js
// Open this file in WebStorm
// Right-click on it in the editor
// Select Debug (this will run the file with Node.js)
// Open the Debugger Console tab in the Debug tool window
class Cat {
constructor(name, age, color) {
this.name = name;
this.age = age;
this.color = color;
@prigara
prigara / App-1.js
Last active Jun 20, 2018
Extract React Component
View App-1.js
// Before refactoring
import React, { Component } from "react";
import "./App.css";
class App extends Component {
constructor(props) {
super(props);
this.state = { isToggleOn: true };
this.handleClick = this.handleClick.bind(this);
@prigara
prigara / app.module.ts
Created May 14, 2018
Unoptimized imports
View app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms'; // FormsModule is no longer unused, so we can remove its import
import { AppComponent } from './app.component';
import { NgModule } from '@angular/core';
import { ApplicationInitStatus } from '@angular/core'; // this one imports from the same module as the one above, so they can be merged into one import
View App.js
export default class App extends Component<{}> {
sayHi() {
console.log("Hello!") // breakpoint on this line
}
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
View index.js
var express = require("express");
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Welcome!' });
next()
});
router.get('/:lang', function (req, res) {
View markdown.md

Hi! I'm from the Webstorm team at JetBrains. We were planning to release a similar plugin to support Styled Components within the nearest days when we saw this. We would love it if you could accept our implementation so that the community of Styled Components users would be able to contribute.

I've made some changes. The main points are:

  1. When building injected file content we replace the string interpolation argument with a fake identifier to avoid breaking the CSS syntax structure as much is possible. For example, in case of
let someCss = styled(Box) `
@prigara
prigara / example.html
Created Jul 29, 2016
Sample file for WebStorm Quick start quide
View example.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Meet WebStorm</title>
</head>
<body>
<div class="container">
<h1 id="greeting">Hello!</h1>