CodeNewbie Community

loading...
Cover image for How do you start your project?

How do you start your project?

GecikaDM
I am an IT technician and I ve done a kind of bootcamp for about 5months to start another career in web development.
・1 min read

Hello everyone,
I have been learning web development for about 2 years with some breaks as I am working as an IT technician and sometimes it can be uneasy to get some free time and being dynamic to concentrate on a project.

One of my hobbies is taking pictures, I like photography. And recently after making my cv online, I thought about making a photo blog using Gatsby.

However, I think that most of the time, I go straight up to the development phase by started the HTML structure. Unfortunately, and I think you guess it, it starts to be messy as I haven't made a plan!

I have started to think about it and I know this is how you have to proceed to be efficient and not being lost like me.

That is what I try to set in mind before starting my project :

  1. define a sitemap
  2. create a wireframe
  3. define graphics
  4. start development
  5. test
  6. deployment

If anyone as any advices or plan to follow in order to make easier to start a project, I would appreciate.

I would be interested also to know how much time you spend on it. Of course, I guess that the first sketch won't probably be the only one and that most of the time, you have to change plans.

Thanks for all your advices

Discussion (9)

Collapse
jonoyeong profile image
Jonathan Yeong

That's a fine plan you have already! A lot of it depends on the project itself, and what your goals are. For example, if you know exactly what you're going to build up front then getting all your requirements down, the design finished, and then starting to code is a great way to do it!

For me, most of the time, I have no idea what I want to build. I normally take an iterative approach. I'll start with designing part of my site - say a homepage. Then I build it. Then I test/deploy and start working on a different part of the site. I don't always stick to this rule. For example, if I design a homepage with blog posts. But I haven't coded that functionality yet. Then I might build that functionality knowing that it's rough and I can iterate on it later.

I really enjoy this process. It feels like I'm polishing a feature over time. And it means I can get to building faster. I don't spend too much time on planning.

Collapse
andrewbaisden profile image
Andrew Baisden

I would create a design using Figma first before building it 😁

Collapse
michaelcurrin profile image
Michael Currin

I have used Wix before to mock up a site because I have access to widgets I can drag and drop.
Then in a few minutes I have something I like or a few different versions I can compare (full screen carousel vs grid gallery? Dark or light theme?)

Then I can go and build it from scratch using code and a static site theme.

Collapse
andrewbaisden profile image
Andrew Baisden

Cool I have been meaning to try out Wix and Squarespace for experimental reasons.

Collapse
gecikadm profile image
GecikaDM Author

I will look at figma, thx

Collapse
michaelcurrin profile image
Michael Currin

That's a great plan.

You might also decide that deploying a site with one page only and just 3 images is your first goal. Then you have that as a milestone to anchieve, which you can build on top of and feel good about and it can be shared with people. Rather than attempting to build out a site with 10 pages and 50 blog posts which never feels finished and then postponing deploying it. As another comment says, an incremental approach is good.

Then with the core site or prototype (even if it is not URL you share with people yet) you can go about adding more images, optimizing images, adding more pages, writing content, etc.

Collapse
mccurcio profile image
Matt C

Hey Michael,
I absolutely agree with slowly deploying ideas or websites.
Start simple then build sophistication.

I like to say KISS; (my version is) Keep it simple & short.

Collapse
michaelcurrin profile image
Michael Currin

I'd also add a step before the sitemap.

Collecting inspiration. I like to draw on paper, screenshot websites or themes or widgets I like, collect links to tutorials and existing sites.

Its like a moodboard on Pinterest.

It helps you pick up design and structure decisions, whether deliberate or subconscious influence. And you can figure out what resonates with you. Maybe the pink and yellow bright sites by your favorite photo bloggers or instagrammers make you inspired. Maybe the old fashioned font and black and white artist photos next to the mysterious bio speaks to you. Maybe the minimal design and soft buttons of a famous photographer's site speaks to you.

Here is a gallery site of mine, forked from another repo.

artists-portfolio.netlify.app/

It is built on Jekyll. You might like the theme or the pop up experience or the menu or the fact that large size images are in the repo and they get outputted as a fast loading thumbnails at build time thanks to a plugin.


Write down words and ideas that you like. How do you want someone to feel when they look at your site? Who is your audience? what is the main goal - to email you, to buy a print, to follow you on social media? Make sure that the design you choose honors your written intent for the site.

Collapse
mccurcio profile image
Matt C

Thanks,
Your numbered bullets would be a great start for a mind map. ;)
Do you know FreePlane? I love it.