plugin or library? this project or dive straight into coding? for help or figure it out myself? Should I use this that Should I plan Should I ask Sounds familiar? That all changed when I started implementing the below points into my routine. I know how you feel. I felt the same way. Whether you are a or , chances are that some of these points will help you to . newbie professional bring your front-end development career to the next level Here are 8 tips to . help you to become a better front-end developer 1. Plan your projects The first mistake and surprisingly even with senior developers is that . very common most of us don’t plan , we don’t know how to plan and . It’s boring we feel that it’s not our job That’s why we quite often skip this . very important step Good planning can help you to: a lot of save you time when the deadline is approaching reduce stress comfortably finish on time everyday And it . doesn’t have to be complicated Simply putting down a list of templates and elements which need to be converted from PSD to HTML or breaking up any complex elements into a smaller parts and writing them down is enough. Making a simple project based to-do list will allow you to: stay organised and focused on the task at hand keep your head clear highlight any roadblocks in the project phase early keep your client, boss or project manager in the loop easily More on the last benefit in the point #2. Helpful tools for planning — dump a list of templates into a Workflowy bullet list Workflowy — create a website site map Writemaps — create a project board and cards for each of your templates and elements Trello — all of the above in an old fashioned but still effective way Pen and paper Planning is important, but . not always everything goes as carefully planned 2. Be Proactive There is nothing worse then telling your client or boss, that and that the project . things are taking longer than expected won’t be delivered on time Proactively highlighting any roadblocks or delays is a way to . very powerful keep everyone happy than initially planned, but . It’s ok if things are taking longer it’s not ok to keeping this for yourself You’re stacked with a bug or can’t figure something out? , everyone even the most experienced developers have . You are not alone the same issues on almost every project When this happens, ! call it out Everyone will appreciate that you are and with the progress. trying your best keeping them in the loop Do you want to ? Send them a short summary of what you did today and what you will be working on tomorrow, highlighting any concerns. delight your client and boss It should only , and if you use tools from #1, . take 5 minutes even less time for that because it to think about a plan B, which might be simply asking the client for more money or . They will love you gives them a time extending the deadline Other reasons why to be proactive: it makes you look more professional it boosts your credibility it helps to build a trust Setting a will help you to never forget to give a project progress update. daily or weekly reminder Helpful tools for reminders — create a simple reoccurring event Google Calendar — create a note with a checklist of your tasks and set a reminder Evernote — doesn’t need a description, does it. iOS Reminders about the next point? . Curious Great 3. Be curious I believe that one of on this list . the most important attributes is being curious New tools, plugins, techniques and languages are being released almost . every day It is that you stay to all the new things and will to explore and understand them. very important open make an effort The bad and at the same time the beauty of is that it’s moving forward . front-end development very fast This means that you can but also your skills can . quickly become an expert become very quickly outdated : You don’t need to know everything, just having a rough overview about a topic or technique is fine. You can then dive deeper into it when the right project comes along. Tip Helpful sources for front-end development news CSS Weekly HTML5 Weekly JavaScript Weekly Responsive Design Weekly Sidebar.io Web Design Weekly Let and concentrate on the top news only. others filter out the noise 4. Invest in your skills and everything related to it and any skill, believe it or not is . Front-end development is just a skill learnable You will need to . I don’t mean on expensive courses, seminars or books, I am more thinking about . invest in yourself in order to grow spending money investing your time There is and researches show that it takes around , that’s around . no short-cut to success 10000 hours to master a skill 4 years practicing 40 hours a week to put up with late nights exploring other websites, experimenting with a new plugins and frameworks, reading web development blogs, listening to podcasts and chewing through thousands of tweets. Be prepared : Schedule a time for self-development into your week. I know this might be harder if your employer doesn’t support you, but be prepared to invest some of your free time into your own career. TIP Helpful blogs and podcasts for front-end developers CSS Tricks Codrops ShopTalk Podcast Boagworld Podcast Apply Filters Podcast : Setting the podcast playback to 1.5x or 2x speed will help you to get through more stuff quicker. BONUS TIP Did you say ? yes, sir 5. Don’t say YES to everything , we all know that. Clients and bosses are demanding But saying yes to everything can and you will end up working for less, being under the pump and . eventually turn against you stressed out what are the project requirements and align that with . Also be sure to ask which browsers you need to support. Carefully evaluate your skills There is in highlighting which parts of the project will need a or will need to be . nothing wrong senior assistance left out of the project scope Highlighting these will make the whole process from start to finish for everyone. earlier in the project timeline much smoother : Don’t be afraid to call out functionality or feature which is out of your skill set. Being honest is the key, but also make sure you don’t say no to everything. Tip Did you say ? no, sir 6. Don’t say NO to everything Contradictory to the previous point, but also important attribute of a is learning . highly effective front-end developer something new on every project Each project is a great way to implement a feature which you are not familiar with or you do . something new for the first time By and only doing the things you are familiar with, you are essentially for . saying no to everything closing the doors personal and career development You will soon drown in the sea of . average developers On the other hand, exploring the unknown will give you a and will keep you again and again. great feeling of achievement, satisfaction hungry to learn new things : Pick a feature, plugin or a technique you wanted to use for some time and implement it in your next project. Tip And if you need, to steer you . use a mentor into the right direction 7. Find a mentor You are keen to learn, but ? What should you ? How to implement this or that? not sure where to start learn next That’s what mentors are great for. Find someone with more experience than you, someone who is keen to . help you to grow Your mentor should be someone , someone who you would like to . Someone who can teach you how to code and . who you respect be like what to avoid doing This could be your , your or someone who you will follow. boss colleague online might have a formal in place, but if you are in a small studio or on your own, . Bigger companies mentorship program look on the internet Following developers like a , or getting a mentor through or . Chris Coyier Paul Irish Thinkful similar programs might be a good idea : If you are not going forward, you are going backwards, especially in web development. TIP A good mentor will help you: to on your project approach get advice to get a sense of direction to help you foresee any potential roadblocks : Remember a mentor a guy who will do everything instead of you and . You still need to in order to grow. Tip is not is not there to motivate you be curious and self-motivated Still with me? ..thanks, but don’t forget to move. Great 8. Stay active Working in the digital industry means that we spend a staring at the computer screen. lot of time in the office will sooner or later take it’s toll. Sitting 40–60 hours That’s why it’s that you the same way as you take care of keeping your markup nicely organised and commenting everything you do. vitally important look after your body . So when you schedule your week, don’t forget to include some — walk, run, gym or whatever else will make you forget about all the pixels around you. Healthy body and healthy mind means a better code non digital activities : Watching YouTube or TV is not an escape from the tech world and . Anything that will. Tip won’t make you feel refreshed gets your blood pumping I am off for a . run now Always test your code across different browsers and mobile devices.You can build your own cross-browser cloud infrastructure and mobile device lab or you could just use . BONUS: Endtest
