I recently graduated from Flatiron Coding Bootcamp in New York and entered the job market., Como um desenvolvedor web frontend procurando uma posição de nível de entrada eu acredito que é importante ter um site de portfólio profissional que exibe todos os seus projetos, especialmente se você não tem qualquer experiência de codificação anterior ou um grau CS formal. Entrar no mercado de trabalho em meio à pandemia de coronavírus é assustador para dizer o mínimo, então eu decidi usar este tempo para praticar minhas habilidades, aprender novas e espero construir projetos legais ao longo do caminho. Este post no blog é sobre o meu primeiro projeto que eu construí durante a quarentena que foi ao vivo-o meu site de portfólio pessoal.,
Antes de construir o meu site Eu criei um plano de como eu vou abordá-lo. Os segmentos que eu precisava para trabalhar em são assim:
Planejamento — compreender a finalidade, estrutura de tópicos resultados
Design — esboçando ideias trabalhando em esquema de cores e tipografia
Desenvolvimento — escrever o código
Publicação de hospedagem e a obtenção de um nome de domínio personalizado
Planejamento
Para iniciar a construção de qualquer coisa na vida é útil ter um plano ou idéia do que você quer criar e como você quer que ele procure., É ótimo começar com o propósito em mente, ou como Simon Sinek diria – “comece com o porquê”. No meu caso, o meu objectivo era construir um site de portfólio pessoal que tivesse todas as minhas informações, todos os projectos que construí no passado e a minha biografia pessoal. Este site deve ser muito simples, intuitivo, sensível e representar-me como um indivíduo, bem como um desenvolvedor web hábil. Tem que ter um design limpo e moderno e ter uma bela interface. Deve ser único e criativo. Foi muito!, Mas quanto mais concreto você começa em todos os detalhes mais fácil será executar. Ao delinear os produtos que implementei histórias de usuário como:
— o Usuário é recebido com uma Home page (isso deve ser algo criativo e único, no meu caso eu usei três.,
— o utilizador pode navegar para contactar a minha página (esta página terá todas as informações de contacto necessárias, bem como ligações a quaisquer redes sociais e Github)
p> Depois de entender o propósito e planejar um esboço áspero é hora de pensar sobre design!, Sou uma pessoa muito visual, por isso era definitivamente uma das minhas partes favoritas. Comecei a desenhar as plantas de wireframes para as minhas páginas. Eu simplesmente usei caneta e papel, mas você pode usar quaisquer ferramentas que você gosta, por exemplo, eu também gosto de Figma que é uma ferramenta de design digital e prototipagem. Você pode usá-lo para criar sites, aplicativos ou componentes de interface de usuário menores que podem ser integrados em outros projetos., O primeiro esboço do meu wireframes ficou assim:
Simples avaliações de mão
assim como a planta baixa de um prédio, um esboço descreve detalhes de forma clara e especificamente ao dar os construtores (você, outros designers, desenvolvedores, etc.) uma visão geral do projecto. Depois que as plantas foram terminadas eu comecei a pesquisar o esquema de cores para o meu site., Eu não sou um designer, mas eu tinha um entendimento de que o esquema de cores deve ser muito moderno e limpo. Eu vou listar alguns grandes recursos que eu encontrei para a pesquisa de cores no final deste blog. Depois de uma considerável quantidade de pesquisa eu acabei pegando preto como minha cor primária (principalmente porque minha Home page tinha um gráfico 3D de viajar pelo espaço) e neon rosa como meu pop secundário de cor.
A tipografia desempenha um papel importante na definição do tom, Tema e mensagem de um site. Para o meu site Eu escolhi Orbitron – um tipo geométrico sem serif destinado para fins de exibição., Funcionou perfeitamente com o meu tema espacial e faz lembrar os filmes de ficção científica que costumava ver e amar quando era criança. A segunda escolha para a fonte caiu para Raleway — foi um dos pares mais populares com Orbitron de acordo com fontes do Google. Esta é a minha página Sobre apresentando uma foto da parede de graffiti que eu tirei na escola Flatiron no centro de Manhattan, que diz “trabalhar duro, ser agradável, ser positivo, ficar com fome e ter fé de que tudo vai funcionar fora — a escola Flatiron” — meu mantra até hoje!,
Desenvolvimento
Agora é o tempo para a parte mais emocionante — escrever o código! Há um monte de debate on-line sobre a criação de um site personalizado vs usando um modelo e há certamente prós e contras para ambas as opções., Tanto quanto eu entendo, não faz mal usar um modelo — é mais rápido, mais simples e mínimo e se você está apenas no início de sua carreira como um desenvolvedor da web, definitivamente será mais fácil para você. No entanto, não me leve a mal você ainda deve personalizá-lo e adicionar recursos e funcionalidade para mostrar suas habilidades de programação.
comecei pessoalmente com um modelo de Bootstrap, mas acabei por criar todas as minhas páginas do zero, porque dessa forma eu poderia personalizá-lo mais. Levou muito mais tempo, mas valeu a pena e estou muito feliz com o resultado., O principal objetivo deste site portfólio é mostrar os projetos que você construiu, mas o próprio site também conta como um projeto, é claro! Esta é a minha página de Projetos, apresentando os projetos que eu construída no Flatiron:
Publicação
Para publicar seu novo site você vai ter que decidir sobre o nome de domínio e hospedagem de site., Nome de domínio é o endereço do seu site que as pessoas digitam na barra de URL do navegador para visitar o seu site. De acordo com a minha pesquisa é importante ter um nome de domínio personalizado, porque aumenta a credibilidade e ajuda você a ser encontrado on-line mais facilmente, no entanto, não é obrigatório. Eu pessoalmente decidi ir com o nome de domínio personalizado que eu comprei de namecheap.com.
hospedagem Web é o lugar onde todos os arquivos de seu site estão localizados. É como a casa de seu site onde ele realmente vive., Uma boa analogia seria se o nome de domínio fosse o endereço de sua casa, então hospedagem web é a casa real que aponta para o endereço. Todos os sites na internet, precisam de hospedagem web.
As Páginas GitHub São páginas web públicas hospedadas gratuitamente através do GitHub e é o recurso que eu usei para hospedar a mina. Os usuários do GitHub podem criar e hospedar sites pessoais (Um permitido por usuário) e sites relacionados a projetos específicos do GitHub, desde que eles tenham o código fonte em um repositório público no GitHub., Depois que meu site foi publicado, eu fiz algumas mudanças nele e cada vez que ele foi implantado sem problemas. Esta opção funcionou muito bem para mim porque era livre e fácil de configurar.
desde que eu comprei meu nome de domínio de uma empresa separada e hospedou o meu site gratuitamente com páginas GitHub que exigiu um pouco de configuração. Depois de apontar o meu nome de domínio para a minha empresa de hospedagem web, editando as configurações DNS e esperando por um dia meu site foi ao vivo!, If you’re interested you can find it here https://alenanikulina.nyc
