En tant que personne totalement inexpérimentée en programmation, j'ai résumé ce sur quoi j'ai travaillé dans les trois mois précédant la création du portfolio. Le portfolio a été créé en 3 mois au total: apprentissage de base (1 mois) et création de portfolio (2 mois). J'espère que cela sera utile pour ceux qui veulent devenir ingénieurs issus de personnes inexpérimentées comme moi.
【Aperçu】 Ceci est une application d'affichage pour les débutants au golf. Je l'ai créé comme un outil pour résoudre les problèmes que les débutants au golf ont de mon expérience en tant qu'étudiant. 【URL】 https://golfour.herokuapp.com 【GitHub】 https://github.com/matao0214/golfour [Langue / Technologie utilisée] ・ Rubis 2.5.1 ・ Ruby on Rails 5.2.4 ・ HTML (mince) ・ CSS (Sass) ・ Bootstrap4 ・ JavaScript ・ JQuery ・ PostgreSQL 12.2 ・ GoogleMapsAPI ・ Heroku ・ Git ・ GitHub
Tout d'abord, j'ai procédé à l'apprentissage en utilisant les livres suivants afin de saisir les connaissances de base. [HTML et CSS pour les personnes qui démarrent le Web, JavaScript](https://www.amazon.co.jp/%E3%81%93%E3%82%8C%E3%81%8B%E3% 82% 89 Web% E3% 82% 92% E3% 81% AF% E3% 81% 98% E3% 82% 81% E3% 82% 8B% E4% BA% BA% E3% 81% AEHTML-CSS% E3% 80% 81JavaScript% E3% 81% AE% E3% 81% 8D% E3% 81% BB% E3% 82% 93% E3% 81% AE% E3% 81% 8D% E3% 81% BB% E3% 82% 93-% E3% 81% 9F% E3% 81% AB% E3% 81% 90% E3% 81% A1% E3% 81% BE% E3% 81% 93% E3% 81% A8 / dp / 4839959714) [Introduction à Ruby pour ceux qui veulent devenir des professionnels](https://www.amazon.co.jp/%E3%83%97%E3%83%AD%E3%82%92%E7%9B%AE%E6 % 8C% 87% E3% 81% 99% E4% BA% BA% E3% 81% AE% E3% 81% 9F% E3% 82% 81% E3% 81% AERuby% E5% 85% A5% E9% 96 % 80-% E8% A8% 80% E8% AA% 9E% E4% BB% 95% E6% A7% 98% E3% 81% 8B% E3% 82% 89% E3% 83% 86% E3% 82% B9% E3% 83% 88% E9% A7% 86% E5% 8B% 95% E9% 96% 8B% E7% 99% BA% E3% 83% BB% E3% 83% 87% E3% 83% 90% E3% 83% 83% E3% 82% B0% E6% 8A% 80% E6% B3% 95% E3% 81% BE% E3% 81% A7-Software-Design-plus% E3% 82% B7% E3% 83% AA% E3% 83% BC% E3% 82% BA / dp / 4774193976) [Guide pratique d'apprentissage rapide de Ruby on Rails 5 qui peut être utilisé sur le terrain](https://www.amazon.co.jp/%E7%8F%BE%E5%A0%B4%E3%81%A7%E4%BD%BF % E3% 81% 88% E3% 82% 8B-Ruby-Rails-5% E9% 80% 9F% E7% BF% 92% E5% AE% 9F% E8% B7% B5% E3% 82% AC% E3 % 82% A4% E3% 83% 89-% E5% A4% A7% E5% A0% B4% E5% AF% A7% E5% AD% 90 / dp / 4839962227)
Ce fut un mois difficile, mais j'ai pris l'habitude des deux points suivants.
** 1. Continuez sur Google jusqu'à ce qu'il n'y ait plus de mots inconnus ** Quand je cherchais quelque chose que je ne comprenais pas, un mot que je ne connaissais pas apparaissait dans l'explication, et je le cherchais plus loin, et ainsi de suite. Cependant, si vous continuez à le faire, la quantité de connaissances augmentera sûrement et la quantité de recherche diminuera, il est donc important de continuer la recherche sans abandonner.
** 2. Le contenu d'entrée est produit par Qiita ** Les connaissances d'entrée ont été produites dans un article de Qiita afin d'améliorer la compréhension. Quand j'ai lu un livre et que je pensais ** «Je comprends!» **, mais quand j'ai essayé de le sortir, je ne pouvais pas le verbaliser et dans de nombreux cas, je ne pouvais pas le comprendre pleinement. Je pense que la sortie vers Qiita est très efficace pour ** la confirmation et l'établissement du niveau de compréhension **, donc je le recommande.
Écrivez des phrases faciles à comprendre! Il est important de ** l'écrire pour le moment ** sans réfléchir! Si vous gérez les chiffres, vous vous habituerez à écrire, donc je pense qu'il vaut mieux sortir activement et en faire une habitude.
Après avoir terminé l'apprentissage de base, je suis passé à la création d'un portfolio. Le portfolio a été créé selon la procédure suivante. ** 1. Idée de portfolio ** ** 2. Conception des fonctions / DB ** ** 3. Création d'un portefeuille **
Le portfolio est ** Quel type de concept et de contexte avez-vous créé le portfolio? Il a été conçu avec ** à l'esprit.
** Notez les problèmes que vous ou un de vos proches (avez) ** ** J'ai réfléchi au type de fonction / mécanisme nécessaire pour résoudre le problème ** et je l'ai mis dans le portfolio.
Plus précisément, j'ai proposé des idées dans l'ordre suivant et je les ai mises en forme.
Quand j'étais étudiant au collège, j'ai commencé à jouer au golf en entrant dans le laboratoire. Et jusqu'à présent, j'ai vécu deux expériences mémorables avec le golf.
- Deux seniors ont commencé à jouer au golf dans l'entreprise pour laquelle je travaillais auparavant. Les deux ne se sont pas améliorés facilement et étaient sur le point d'arrêter en cours de route, mais en continuant à pratiquer tout en donnant des conseils, ils se sont progressivement améliorés et continuent de pratiquer le golf.
De cette expérience, j'ai senti que les débutants au golf ont les ** défis ** suivants. ・ ** Il est difficile pour les débutants d'améliorer leurs compétences et ils abandonnent souvent en chemin. ** ** ・ ** Il y a un certain nombre de personnes dans la vingtaine qui veulent commencer à jouer au golf, mais personne n'est proche d'eux. ** ** ↓ ** Solution au problème: si des jeunes dans la même situation (veulent commencer à jouer au golf / viennent de commencer à jouer au golf) sont proches de nous, pouvons-nous créer un environnement où il est facile de commencer à jouer au golf et un mécanisme moins susceptible d'être frustré? ** ** ↓ ** Forme de service: Une application pour afficher et partager des dossiers de pratique de golf **
Lorsque l'idée du portefeuille a été réglée, j'ai conçu la fonction et la base de données. En nous concentrant sur la fonction d'affichage et de partage des dossiers de pratique de golf, nous avons également conçu la fonction pour maintenir la motivation pour la pratique.
** Conception fonctionnelle ** Nouvelle fonction de publication Fonction d'affichage de liste Fonction d'affichage détaillée Fonction d'édition Supprimer la fonction Fonction de connexion Fonction de recherche Comme fonction Fonction de publication d'informations de localisation (à l'aide de GoogleMapAPI) Fonction de création de graphique à partir des données publiées
** Conception DB ** ** Table des utilisateurs **
| Nom de colonne | Type de données | Contrainte |
|---|---|---|
| nickname | string | NOT NULL,Moins de 10 caractères |
| string | NOT NULL,UNIQUE | |
| password_digest | string | NOT NULL |
| golf_reki | string | Moins de 5 caractères |
| goal | string | Moins de 50 caractères |
** Tableau des postes de formation **
| Nom de colonne | Type de données | Contrainte |
|---|---|---|
| training_place | string | NOT NULL,Moins de 50 caractères |
| training_task | string | NOT NULL,Moins de 150 caractères |
| training_impression | string | Moins de 150 caractères |
| user_id | integer | NOT NULL, FOREIGN KEY |
** Table TrainingContents **
| Nom de colonne | Type de données | Contrainte |
|---|---|---|
| training_post_id | integer | NOT NULL,Foreign_key |
| training_time | integer | NOT NULL |
| training_hits | integer | NOT NULL |
** Tableau des likes **
| Nom de colonne | Type de données | Contrainte |
|---|---|---|
| user_id | integer | NOT NULL, FOREIGN KEY |
| training_post_id | integer | NOT NULL, FOREIGN KEY |
** Tableau des spots **
| Nom de colonne | Type de données | Contrainte |
|---|---|---|
| address | integer | NOT NULL,Moins de 50 caractères |
| latitude | float | NOT NULL |
| longitude | float | NOT NULL |
| training_post_id | integer | NOT NULL, FOREIGN KEY |
La conception des fonctions / bases de données est terminée J'ai finalement commencé à écrire du code. La procédure de création d'un portefeuille est la suivante. ** 1. Mise en œuvre de la fonction CRUD basée sur les livres utilisés dans l'apprentissage de base 2. Implémentez la fonction que vous souhaitez implémenter en vous référant aux articles et aux documents officiels de Qiita. 3. Conception consciente de l'UI / UX **
Immédiatement après avoir terminé l'apprentissage de base, je ne suis toujours pas habitué au codage, donc même si je pense ** "Implémentons cette fonction!" ** ** ・ Comment mettre en œuvre? ・ Je ne sais pas ce que je ne comprends pas ** Parce qu'il était dans un tel état, j'ai fait référence au livre avec le sens de s'habituer au code.
En conséquence, j'ai pu revoir les connaissances de base et m'habituer à la structure de l'ensemble du programme. De plus, ** je peux le faire moi-même! Je peux être confiant avec ** Je pense que c'est une bonne idée de commencer par le niveau de difficulté faible pour maintenir la motivation.
Après avoir implémenté la fonction CRUD, j'ai travaillé sur la mise en œuvre de la fonction similaire et sur l'utilisation de l'API Google MAP.
Lors de la mise en œuvre de la fonction, je l'ai implémentée en référence à Qiita et au document officiel tout en Google. Ce que j'ai trouvé important dans mes recherches, c'est de ** lire absolument la documentation officielle **.
Quand vous lisez la documentation officielle, il est souvent dit ** Il existe des options comme celle-ci! ** En plus de l'explication de la fonction que vous souhaitez implémenter. En intégrant de telles options, les fonctions étaient souvent plus satisfaisantes que prévu.
Les articles de Qiita sont organisés de manière facile à comprendre et sont très faciles à lire et pratiques. Cependant, bien sûr, la fiabilité de la source est inférieure à celle du document officiel, et ** vous ne pouvez pas toucher plus d'informations que nécessaire **, vous devriez donc lire non seulement l'article Qiita mais aussi le document officiel.
Après avoir implémenté toutes les fonctions, j'ai commencé à concevoir avec UI / UX à l'esprit. Introduction à l'amélioration UI / UX: "3 points d'amélioration UX" de "Différence entre UI et UX" est expliqué!
Plus précisément, j'étais au courant des trois points suivants. ** ・ Conçu avec l'objectif (20) à l'esprit ・ Design qui vous donne envie de continuer à utiliser ・ Conception intuitive **
Et je l'ai mis dans le portfolio sous la forme suivante. ** - Arrière-plans et polices pop pour les jeunes -Changé le champ de saisie du contenu publié en une formule de sélection à partir d'options spécifiques (éliminant le problème de penser au contenu d'entrée) ・ Visualisation intuitive des dossiers de pratique à l'aide de graphiques **
Parmi ceux-ci, il était particulièrement judicieux d'incorporer la visualisation graphique. Au début, le dossier de pratique de l'utilisateur était affiché en lettres et en chiffres, mais en représentant graphiquement les données, nous avons pu réaliser une conception qui facilite l'obtention visuelle des informations souhaitées. Il est recommandé d'utiliser le jem chartkick car vous pouvez facilement créer un graphique.
** ・ Parce que vous pouvez le faire de toute façon, déplacez votre main et habituez-vous au code ・ Mise en place de fonctions et construction de mécanismes qui donnent envie de continuer à utiliser ・ Conception soucieuse de la cible ・ Facilité d'utilisation du point de vue de l'utilisateur ・ Codage hautement maintenable **
** ・ Le plaisir de mettre vos idées en forme (c'est ce que j'ai réalisé le plus: sourire :) ・ Capacité d'auto-propulsion en tant qu'ingénieur capable de créer des services à partir de zéro ・ Capacité à verbaliser et enquêter sur ce que vous ne comprenez pas (capacité à google) ・ Comment sélectionner les références (un document officiel est requis) ・ Importance de la production **
Grâce à la création du portfolio, j'ai beaucoup appris et grandi au cours des trois derniers mois. J'étais convaincu que je pourrais en faire autant même si je n'avais jamais touché à la programmation, et surtout, j'ai appris que ** le plaisir de créer un service avec mes propres idées **.
Il y a encore beaucoup de choses que je souhaite faire, comme créer une infrastructure avec AWS, mais je commencerai d'abord par rechercher un emploi pour les ingénieurs. J'aimerais faire de mon mieux pour décrocher un emploi tout en mettant à jour mon portfolio!
Recommended Posts