Quer estudar sobre algo além do trio mágico HTML, CSS e Javascript e não sabe por onde começar?
Segue uma lista com sugestões de estudo extra para Desenvolvedores Front-End.
- Harp
- Hexo
import React, { useState } from 'react'; | |
import styled from 'styled-components'; | |
import media from 'styled-media-query'; | |
import * as S from './styles'; | |
import * as T from '../Typograph'; | |
import Icon from '../Icons'; | |
export const Wrapper = styled.div` | |
padding: 16px; | |
background: #ffffff; |
{ | |
// Define o tema do VSCode | |
"workbench.colorTheme": "One Dark Pro", | |
"editor.minimap.enabled": false, | |
// Configura tamanho e família da fonte | |
"editor.fontLigatures": true, | |
"editor.fontSize": 12, | |
// Aplica linhas verticais para lembrar de quebrar linha em códigos muito grandes |
.select | |
.select-tiny | |
.select-small | |
.select-middle | |
.select-large | |
.select-extra-large | |
.btn | |
.btn-tiny | |
.btn-small |
Frameworks CSS | |
http://getbootstrap.com/ | |
http://foundation.zurb.com/ | |
http://icalialabs.github.io/furatto/index.html | |
http://purecss.io/ | |
http://metro-webdesign.info | |
http://gumbyframework.com/ | |
http://startbootstrap.com/ (templates do bootstrap free) | |
http://www.blacktie.co/ (templates bootstrap free) |
export PATH=$PATH:. | |
# export PATH=$PATH:/usr/bin | |
export MYSQL_HOME=/usr/local/mysql | |
alias start_mysql='sudo $MYSQL_HOME/bin/mysqld_safe &' | |
alias stop_mysql='sudo $MYSQL_HOME/bin/mysqladmin shutdown' | |
export LANG=en_US.UTF-8 | |
export LC_ALL=en_US.UTF-8 |
module.exports = function(grunt) { | |
'use strict'; | |
// Carrega os plugins relacionados no package.json | |
//require('time-grunt')(grunt); | |
require('load-grunt-tasks')(grunt); | |
// Utilizamos o método grunt.file para fazer o parse do grunt-config.json | |
var gruntConfig = grunt.file.readJSON('./grunt-config.json'); |
Programas para ambiente de trabalho | |
- Sublime Text 3 - sublimetext.com/3 | |
- NodeJS | |
- Git | |
- Stylus | |
- BowerJS | |
- Yeoman | |
- Gimp | |
- Photoshop |
project | |
|- src | |
| |- imgs | |
| |- js | |
| |- stylus | |
| |- core | |
| |- base | |
| |- layout | |
| |- ui | |
|- build |
. | |
├── base | |
│ ├── config.styl | |
│ ├── mixins.styl | |
│ ├── helpers.styl | |
│ └── grid.styl | |
├── core | |
│ ├── reset.styl | |
│ ├── forms.styl | |
│ ├── tables.styl |